Scribd Logo
Upload

Welcome to Scribd!

  • 6 views

    CSS Micro Project

    Uploaded by

    sk73sahil
    client side script language

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd

    CSS Micro Project

    Uploaded by

    sk73sahil
    6 views11 pages
    client side script language

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    client side script language

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    6 views11 pages

    CSS Micro Project

    Uploaded by

    sk73sahil
    client side script language

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    of 11

    INDEX

    SR NO CONTENTS PAGE NO.


    1 Aim Of Micro-Project 2

    2 Course Outcome 2

    3 Purposed Methodology 2

    4 Action Plan 3

    5 Resources Required 4

    6 Group Members- 4

    7 Introduction 5

    8 Objective 5

    9 Description Of Project 6

    10 Technology And Tools Used 6

    11 Advantages 6

    12 Program Code 7 to 9

    13 Output 10

    14 Conclusion And Refrence 11

    pg. 1
    PLAN-A
    Micro-Project Proposal

    DEVELOPING SIMPLE ANIMATION FOR REVOLVING AN EARTH AROUND SUN

    Aims/ Benefits of the Micro - Project:

    1. To develop a program for animated a circle revolving around


    another circle.
    2. The aim of this project is to how animated a circle revolving
    around another circle is created using java script.

    1.0 Course Outcomes Addressed

    1. Implement arrays and functions in java script.


    2. Use java script for handling Cookies.

    2.0 Proposed Methodology


    In this project we will learns how to develop animation for
    revolving an earth around sun using javascript. We will create a code in
    html using javascript. In this code for displaying animation for revolving
    an earth around sun more attractive we will use various tags like
    canvas,script tags etc. We also use user defined functions. In this code
    we also various graphics objects like circle, line, are. In this manner we
    are trying to show animated solar system in javascript.

    pg. 2
    3.0 Action Plan

    Sr. Details of Activity Planned Planned Name of responsible


    No. Start Date Finish Date Team members.

    1 Identify the 12/10/2024 12/10/202 Sarthak Purandare


    requirements. of 4
    the project
    2 Design the 12/10/2024 12/10/202 Fahad Khan
    structure of the 4
    project.
    3 Input micro project 13/10/2024 13/10/202 Sahil Shaikh
    information in MS 4
    word
    4 Create MS word file 14/10/2024 14/10/202 Imad Shaikh
    and show file to 4
    guide
    5 Preparing report 14/10/2024 14/10/202 Sahil Shaikh
    4

    6 The report 17/10/2024 17/10/202 Shinde S.R.


    submitted to the 4
    teacher.

    pg. 3
    4.0 Resources Required

    Sr. Resources Required Specification


    No.
    1 Computer System Computer, RAM Minimum
    4GB
    2 Internet Wikipedia

    3 Operating System Windows/Linx

    Names of Team Members with Roll Nos.

    Sr. Roll. Number Name of Student


    No.
    1 2209590263 Shaikh Sahil Chandpasha

    2 2214920335 Khan Fahad Feroz

    3 2214920313 Shaikh Imad

    4 23511910538 Purandare Sarthak Prashant

    pg. 4
    PLAN-B
    INTRODUCTION

    JavaScript is a Programming Language commonly used in web


    development. It was originally developed by Netscape as a means to
    add dynamic and interactive elements to websites. While JavaScript is
    influenced by Java, the syntax is more similar to C and is based on ECMA
    Script, a scripting language developed by Sun Microsystems.
    JavaScript is a client-side scripting language, which means the
    source code is processed by the client's web browser rather than on the
    web server. This means JavaScript functions can run after a webpage
    has loaded without communicating with the server. For example, a
    JavaScript function may check a web form before it is submitted to
    make sure all the required fields have been filled out. The JavaScript
    code can produce an error message before any information is actually
    transmitted to the server.

    OBJECTIVE

     To develop a program for animated a earth revolving around a


    sun.
     The aim of this project is to show how animated a earth revolving
    around a sun using javascript.

    pg. 5
    DESCRIPTION OF PROJECT

     In this project we will learns how to develop animated a earth


    revolving around a sun using java script. We will create a code in
    html using javascript.In this code for displaying animated a earth
    revolving around a sun more attractive we will use various tags
    like canvas, script tags.etc. We also use user defined functions.In
    this code we also various graphics objects like circle, line, arc. In
    this manner we are trying to show animated a earth revolving
    around a sun in javascript.

    TECHNOLOGY AND TOOLS USED

     System used(COMP/LAPTOP): Computer Processor, 4GB RAM


     Operating System: Windows 7
     Software: Notepad

    ADVANTAGES

     User can get more information by seeing virtual image.


     This will increase the interest of the user to perform more
    graphical animations.

    Program Code

    pg. 6
    <!DOCTYPE html>
    <html>
    <head>
    <style>
    body
    {
    background-color: #000;
    overflow: hidden;
    }
    #sun
    {
    position: absolute;
    width: 150px;
    height: 150px;
    background-image: linear-gradient(red, yellow);
    border-radius: 50%;
    left: 0%;
    top: 13%;
    margin-left: 250px;
    margin-top: 50px;
    animation: rotateSun 15s linear infinite;

    pg. 7
    box-shadow: 0 0 54px orange;
    text("Sun", "white","15pt arial", -50,7);
    }
    #earth
    {
    position: absolute;
    width: 50px;
    right: 335px;
    bottom: 135px;
    height: 50px;
    background-color: #0099cc;
    border-radius: 50%;
    animation: rotateEarth 5s linear infinite;
    box-shadow: 0 0 34px #3a4385;
    }
    @keyframes rotateSun
    {
    0%
    {
    transform: rotate(0deg);
    }
    100%

    pg. 8
    {
    transform: rotate(360deg);
    }
    }
    @keyframes rotateEarth
    {
    0%
    {
    transform: rotate(Odeg) translateX(120px) rotate(0deg); }
    100%
    {
    transform: rotate(360deg) translateX(120px) rotate(-360deg);
    }
    }
    </style>
    </head>
    <body>
    <div id="sun"></div>
    <div id="earth"></div>
    </body>
    </html>
    Output

    pg. 9
    CONCLUSION AND REFRENCE

    pg. 10
    CONCLUSION
    This project can be used to display animation for revolving an
    earth around sun. Instead of using the inbuilt application a user can
    make use of this to make the representation more effective. This will
    increase the interest of the user to perform more graphical animations.

    REFRENCE

    1. BookName- Javascript Demystified. Author- Keogh, Jim


    Publication- McGraw-Hill 2015, New DelhilSBN:0-07060347-2.
    2. BookName- Beginning JavaScript Author- Wilton, Paul
    Publication- Wilyindia, New Delhi, 2015, ISBN:0-7645-5587-1

    pg. 11

    You might also like