2013-03-11 172 views
-1

所以我有这个问题。我有一个幻灯片页面,它不会自己滑动,我希望它们能够滑动。下面是代码http://jsfiddle.net/tUUPN/3/如何让幻灯片自行滑动?

$(document).ready(function() { 
$("#slideshow").css("overflow", "hidden"); 
$("#slideshow-nav").css("visibility", "visible"); 
$("#slideshow-nav a[href=#farm1]").addClass("active"); 

$("#slideshow-nav").localScroll({ 
    target: '#slideshow', 
    axis: 'x' 
}); 

$("#slideshow-nav a").click(function() { 
    $("#slideshow-nav a").removeClass("active"); 
    $(this).addClass("active"); 
}); 

}); 

编辑

我更新jsfidde http://jsfiddle.net/tUUPN/10/

+1

由于各种原因,您的小提琴似乎失败了,至少有两个原因是您没有包含jQuery或localScroll插件。 – j08691 2013-03-11 17:13:31

+0

包含jquery.localscroll.js和jquery.scrollTo.js。当我创建它时,该示例没有包含自动滑动功能。我想将它添加到我的代码中,但问题是我不知道如何 – 2013-03-11 17:17:58

回答

0

(在左边外部资源选项卡包括jQuery的文件),我会建议使用jQuery's Animate() method产生滑动效果。您可以阅读相同页面上的API和示例。

您仍然可以应用您的点击功能等,但您在移动/滑动物体时确实需要动画作为选择的武器。

0

创建一个方法转到下一张幻灯片,然后在setInterval中调用该方法。毫秒数决定了它触发的频率。如果你想停止,使用clearInterval。