平滑淡入和淡出全尺寸幻灯片

时间:2014-11-15 22:18:38

标签: javascript jquery html css

我正在网站上工作,我想要一个全尺寸的幻灯片背景。我发现了一个可以运行的jQuery脚本但是图像之间没有很好的淡入淡出。当涉及到javascript和jQuery时,我是个白痴,所以我希望能得到你们的帮助。

这是我正在使用的没有淡入淡出的脚本,只是在图片之间切换。

var header = $('body');

var backgrounds = new Array(
    'url(../moviesite/images/pacific-rim.jpg)'
  , 'url(http://taborat.com/wp-content/uploads/2014/08/tumblr_my0fjwiJDc1qbyi1io1_1280.png.jpeg)'
  , 'url(http://www.hdwallpapers.in/walls/fury_movie-wide.jpg)'
  , 'url(http://news.doddleme.com/wp-content/uploads/2014/10/Dracula-Untold-Wallpapers.jpg)'
);

var current = 0;

function nextBackground() {
    current++;
    current = current % backgrounds.length;
    header.css('background-image', backgrounds[current]);
}
setInterval(nextBackground, 5000);

header.css('background-image', backgrounds[0]);

感谢。

0 个答案:

没有答案