« Helping each other Forum

Hey there! I am new here. How did you guys do the background and animation CSS? [closed]

Posted by Abigblueworld

posted
updated

Forum: Helping each other

For the experimented people


How did you guys do the background-image and animation scripts?


I know div pretty well, and so as other simple HTML programs, but I also don't like using layout templates or that stuff!

So, can you tell me how to do it? 


Report Topic

7 Replies

Sort Replies:

Reply by pawtal!!!

posted

What are you specifically referring to?

I can't tell if you're asking for advice on making an animated background or how the animation property works.


Permalink Report Reply

Reply by Abigblueworld

posted

Both.


And sorry for my confusing undertone, it's autism.



Permalink Report Reply

Reply by pawtal!!!

posted

Well for animated backgrounds, usually it's one of two things:

  • A static background which is animated via animating background-position.
  • A background with a gif as an image source.

For the animation tag, you will need to use @keyframes to make the actual skeleton for your animation by using percentage values to dictate what properties it will change over time.

@keyframes exampleAnimation {

    0% {

        opacity: 1;

     }

     100% {

        opacity: 0;

     }

}


Once you have your keyframes done, you will use the actual animation tag on the element you want to animate and configure accordingly.

animate: exampleAnimation 1s forwards ease-out;


Permalink Report Reply

Reply by Abigblueworld

posted

You broke my brain @Pawtails


Permalink Report Reply

Reply by pawtal!!!

posted

Reply by Abigblueworld

posted

I don't know, you just make me beyond confused


Permalink Report Reply

Reply by pawtal!!!

posted

Well if I had to summarize, if you see anything moving on someone's page it's either a gif or a div that has an animation assigned to it. 


Permalink Report Reply

Abigblueworld closed this Forum Topic