JavaScript changes the page background?

Tell me any JavaScript able to smoothly after a certain period of time to change background-image for the whole page ( body ).
July 9th 19 at 13:18
2 answers
July 9th 19 at 13:20
Solution
Don't know if still true, but as an alternative solution:
Make the page normal bootstrappable roundabout offered her the necessary timing and add something like a script. It works on this logic: each picture has its own color, respectively, of animated need to change the background suits the image that will be displayed.
For clarity, that's how it looks (carefully, GIF heavy): goo.gl/ZXCCHh
In the css you added is such a line:
.main-page { transition: background .8s linear; } /* for a smooth transition */

In HTML each container pictures added data-attribute with the desired color:
<div class="item" data-color="red">
the <div>
 <img class=" header__images" src="img/main-page/slides/3.png">
</div>
</div>

And the script itself:
$("#myCarousel").on('slide.bs.carousel', function (e) {
 var nextItem = $(e.relatedTarget); // read next image pered how it will appear.

 if($(nextItem).data('color') === 'green') { // depending on data-attribute to change the background color 
 $('.main-page').css('background', '#8de257'); 
 } 
 else if($(nextItem).data('color') === 'yellow') { // and then it all slides by analogy
 $('.main-page').css('background', '#f8cc00'); 
 } 
 else if ($(nextItem).data('color') === 'red') {
 $('.main-page').css('background', '#ff5a42'); 
 } 
 else if ($(nextItem).data('color') === 'blue'){
 $('.main-page').css('background', '#68d9fa'); 
};
});


By analogy, you can make and what you need.
July 9th 19 at 13:22
it is possible in css3 to make
What is it like? - murray.Okune commented on July 9th 19 at 13:25
: so for example https://jsfiddle.net/ssfjxmd6/ - Caesar commented on July 9th 19 at 13:28

Find more questions by tags SliderjQueryCSSJavaScriptWeb Development