Создадим эффект плавного переключения изображений фона.
Скрипт меняющегося background-image
<script type="text/javascript"> function setbackground() { window.setTimeout( "setbackground()", 3000); // 5000 milliseconds delay var index = Math.round(Math.random() * 3); var ImageValue = "http://modernstile.ru/files/uploads/12.jpg"; // default Image (index = 0) if(index == 1) ImageValue = "http://mosartdesign.ru/wp-content/uploads/2015/02/decor3.jpg"; if(index == 2) ImageValue = "http://www.stroy.ru/netcat_files/1084_2129.jpg"; if(index == 3) ImageValue = "http://style.wildberries.ru/wp-content/uploads/2014/05/611.jpg"; document.getElementById('uniq').style.backgroundImage = "url(" + ImageValue +")"; } </script>
document.getElementById(‘uniq’) — можно применить к тегу для этого меняем getElementById на getElementsByTagName и прописываен название тэга например header или body. Также важное значение играет окончание Element/Elements — для одного элемента или для нескольких. В случае нескольких элементов после круглой скобки можно добавлять номер элемента в квадратных скобках [](элементы начинаются с 0)
Запуск меняющегося background-image
Запускаем скрипт: добавляем например к body
<body onload="setbackground();">
Для плавности смены слайдов объекту задаем свойство CSS
-webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s transition: background 0.3s;[site-socialshare]