ARyan MAurya
October 27, 2020
3 Comments

You don’t need jQuery for making this trick. You can use simple CSS animation instead, and it will be more performance and simplicity.

In my example, we just add a div with a block class name.

<div class="block"></div>

After that, we add the CSS property

html, body {
     width: 100%;
     height: 100%;
} 

@keyframes color-animation {
    0% {
       background: #ad1457;
    }
    50% {
       background: #6a1b9a;
    } 
    100% {
       background: #bbdefb
    } 
}

.block {
   width: 100%;
   height: 100%;
   animation: color-animation 3s infinite linear alternate;
}

In this code, we created simple css animation, which changes the colors of our block.

3 comments

  1. bahis says:

    I am sure this post has touched all the internet viewers, its really really pleasant article on building up new web site. Thomasa Andrey Beckman

  2. bedava says:

    Excellent post. I am facing many of these issues as well.. Rachel Gal Al

  3. yify says:

    A big thank you for your blog. Much thanks again. Cool. Odetta Joshua Watkin

Post your comment

Your email address will not be published. Required fields are marked *