根本就没有激活。我完全按原样在插件的演示页面中复制了代码,是否有一些我错过了?
<div class="slideshow"
data-cycle-fx=carousel
data-cycle-timeout=0
data-cycle-carousel-visible=2
data-cycle-next="#next"
data-cycle-prev="#prev"
data-cycle-pager="#pager">
<img src="http://jquery.malsup.com/cycle2/images/beach1.jpg">
<img src="http://jquery.malsup.com/cycle2/images/beach2.jpg">
<img src="http://jquery.malsup.com/cycle2/images/beach3.jpg">
<img src="http://jquery.malsup.com/cycle2/images/beach4.jpg">
<img src="http://jquery.malsup.com/cycle2/images/beach5.jpg">
<img src="http://jquery.malsup.com/cycle2/images/beach6.jpg">
<img src="http://jquery.malsup.com/cycle2/images/beach7.jpg">
<img src="http://jquery.malsup.com/cycle2/images/beach8.jpg">
<img src="http://jquery.malsup.com/cycle2/images/beach9.jpg">
</div>
<div class=center>
<a href="#" id="prev"><< Prev </a>
<a href="#" id="next"> Next >> </a>
</div>
<div class="cycle-pager" id="pager"></div
<script type="text/javascript" src="jquery-1.9.1.min.js?$staticlink$"></script>
<!-- JS FILES TO BE INCLUDED-->
<script type="text/javascript" src="anniversary/js/jquery.easing.1.3.js?$staticlink$"></script>
<script type="text/javascript" src="anniversary/js/main.js?$staticlink$"></script>
<script type="text/javascript" src="anniversary/js/jquery.cycle2.js?$staticlink$"></script>
<script type="text/javascript" src="anniversary/js/jquery.cycle2.carousel.js?$staticlink$"></script>
答案 0 :(得分:7)
为了使用循环自动激活滑块或轮播,您必须使用默认的类名“ cycle-slideshow ”,否则您必须声明插件必须查找哪个类:
<script>
$.fn.cycle.defaults.autoSelector = [YOUR-CLASS-NAME]; //single or double quoted class without the square brackets
</script>
不要忘记使用干净的代码编写。你错过了标签中的一些闭包。
这是显示工作代码的fiddle。