当幻灯片改变图像刷新我的页面时

时间:2013-11-08 17:34:28

标签: jquery html

我是jQuery的新手,我正在尝试制作幻灯片。 我创建了它,但是当计时器改变我的图片时,所有页面似乎都被刷新了。

HTML示例

<div class="slide">
    <img id="scroll_image" src="img/rooms/suite5.jpg" width="1000" height="350" alt="hotel-suite-1" class="show" />
    <img id="scroll_image" src="img/rooms/suite1.jpg" width="1000" height="350" alt="hotel-suite-2" />
    <img id="scroll_image" src="img/rooms/suite2.jpg" width="1000" height="350" alt="hotel-suite-3" />
    <img id="scroll_image" src="img/rooms/suite3.jpg" width="1000" height="350" alt="hotel-suite-4" />
    <img id="scroll_image" src="img/rooms/suite4.jpg" width="1000" height="350" alt="hotel-suite-5" />
</div><!--end of slide-->

jQuery示例

$(document).ready(function() {
    slideShow();
});

function slideShow() {
    var current = $('.slide .show');
    var next = current.next().length ? current.next() : current.parent().children(':first');
    current.hide().removeClass('show');
    next.fadeIn().addClass('show');
    setTimeout(slideShow, 6000);
}

如果您click here,您可以看到我的意思,向下滚动页面并等待计时器更改图像!?

1 个答案:

答案 0 :(得分:1)

这不是你的页面令人耳目一新。每次滑动图像时,您的页面都会出于某种原因滚动。

你的问题是你正在使用的jquery-min-1.5.1.js。

Update your jQuery到最新版本,问题就解决了:)你也可以使用最新的外部jquery链接:

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

来源:Is there a link to the "latest" jQuery library on Google APIs?


jsFiddle 使用您的jQuery版本

jsFiddle 使用最新版本(使用上面显示的最新外部链接)

古德勒克!