Cycle2插件不会滑动

时间:2013-05-17 04:55:42

标签: jquery plugins slider jquery-cycle2

我使用jquery和cycle2插件创建一个页面,但是滑块不起作用。我看了几乎一个小时的模板失败,一无所获。网站 link is here ,将四张图片旋转,没有任何反应。 你觉得我做错了什么?创建新模板更容易吗?

我正在使用的html中的代码:

<div id="slideshow" class="cycle-slideshow" data-cycle-fx="scrollHorz" data-cycle-pause-on-hover="true" data-cycle-speed="200" data-cycle-log="false" >  
<img src="img/slider/slide01.jpg" class="first" />  
<img src="img/slider/slide02.jpg" />  
<img src="img/slider/slide03.jpg" />  
<img src="img/slider/slide04.jpg" />
</div>

谢谢!

1 个答案:

答案 0 :(得分:0)

你确定你已经包含了Cycle2的js和css文件吗?而且您正在使用现有图像和正确的路径?您发布的代码没有任何问题,您可以在此处查看:http://jsfiddle.net/natnaydenova/x4dfv/

HEAD部分的某处:

<link rel="stylesheet" href="css/cycle2.css">
<script src="js/jquery-2.1.0.min.js"></script>
<script src="js/jquery.cycle2.min"></script>

然后在你的身体里:

<div id="slideshow" class="cycle-slideshow" data-cycle-fx="scrollHorz" data-cycle-pause-on-hover="true" data-cycle-speed="200" data-cycle-log="false" >  
<img src="http://malsup.github.io/images/p1.jpg" class="first" />  
<img src="http://malsup.github.io/images/p2.jpg" />  
<img src="http://malsup.github.io/images/p3.jpg" />  
<img src="http://malsup.github.io/images/p4.jpg" />
</div>
<div class="center">
    <button data-cycle-cmd="prev"><</button>
    <button data-cycle-cmd="next">></button>
</div>