Scribd Logo
Upload

Welcome to Scribd!

  • 12 views

    Animaion Globe2

    Uploaded by

    Fredj Imed
    This document contains HTML and CSS code to create an animated globe that rotates. The HTML contains basic page structure and links to the CSS stylesheet. The CSS creates a container div with a background image of a globe, positions it in the center, and animates it to rotate the background image from left to right over 2 seconds on repeat to simulate the rotation of the Earth.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content

    You might also like

    Animaion Globe2

    Uploaded by

    Fredj Imed
    12 views1 page
    This document contains HTML and CSS code to create an animated globe that rotates. The HTML contains basic page structure and links to the CSS stylesheet. The CSS creates a container div with a background image of a globe, positions it in the center, and animates it to rotate the background image from left to right over 2 seconds on repeat to simulate the rotation of the Earth.

    Original Description:

    Original Title

    animaion_globe2

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    This document contains HTML and CSS code to create an animated globe that rotates. The HTML contains basic page structure and links to the CSS stylesheet. The CSS creates a container div with a background image of a globe, positions it in the center, and animates it to rotate the background image from left to right over 2 seconds on repeat to simulate the rotation of the Earth.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    12 views1 page

    Animaion Globe2

    Uploaded by

    Fredj Imed
    This document contains HTML and CSS code to create an animated globe that rotates. The HTML contains basic page structure and links to the CSS stylesheet. The CSS creates a container div with a background image of a globe, positions it in the center, and animates it to rotate the background image from left to right over 2 seconds on repeat to simulate the rotation of the Earth.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    of 1

    Animation du Globe

    Image :719px ×400px

    HTML

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Earth Rotating Animation</title>
    <link rel="stylesheet" href="style.css" />
    </head>
    <body>
    <div class="container"></div>
    </body>
    </html>

    *{
    css margin: 0;
    padding: 0;
    }
    body{
    background: #ffffff;
    }
    .container{
    margin:50px auto;
    width: 400px;
    height: 344px;
    position: relative;
    background:rgb(10,100,165) url(bg.png);
    background-repeat: repeat-x;
    background-size: cover;
    border-radius:50%;
    box-shadow: inset 0 0 44px;
    animation: animate 2s linear infinite;
    }
    @keyframes animate
    {
    0%{
    background-position: 0 0 ;
    }
    100%{
    background-position:719px 0 ;
    }
    }

    You might also like