0

我希望当人们访问我的网站时，我希望背景为白色，当页面完全加载时，5 秒后开始淡入背景中的图片，然后每 15 秒后淡入新图片。您是否知道这样做的好方法，或者是否已经有一些预制插件等。

谢谢，

马汀

4

3 回答 3

0

document.ready结合使用setTimeout？

您将setTimeout在document.ready函数中使用不同的计时器调用两个函数。这些中fadeIn的每一个都将通过更改css使用来生成图像：

$('body').css('background-image', 'YOURIMAGESRC');
于 2012-11-02T17:59:17.607 回答
0

加载 5 秒后，在 img 标签的 id 上使用 fadeIn()。每 15 秒运行一次计数器以执行相同的操作。

  <img id="book" src="book.png" alt="" width="100" height="123" />

最初隐藏元素后，我们可以慢慢显示它：

   $(window).load(function () {
      $('#book').fadeIn(15000, function() {
        // Animation complete
      });
    });
于 2012-11-02T18:02:20.953 回答
0

对于颜色过渡效果，您需要使用外部插件。

这是要检查的jsFiddle。

$(document).ready(function() {

    function repeat() {
        $('body')
            .delay(5000).animate({'background-color':'#fff'},1000)
            .delay(5000).animate({'background-color':'#000'},1000);
    }
    window.setInterval(repeat, 10000);

});

颜色过渡效果源： 纯jQuery动画的特殊颜色过渡效果//无ui或其他库

于 2012-11-02T18:12:28.343 回答