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.


  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 *