Jquery循环2轮播不工作没有控制台错误

时间:2013-06-24 17:03:17

标签: jquery-cycle2

根本就没有激活。我完全按原样在插件的演示页面中复制了代码,是否有一些我错过了?

<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">&lt;&lt; Prev </a>
    <a href="#" id="next"> Next &gt;&gt; </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>

1 个答案:

答案 0 :(得分:7)

为了使用循环自动激活滑块或轮播,您必须使用默认的类名“ cycle-slideshow ”,否则您必须声明插件必须查找哪个类:

<script>
  $.fn.cycle.defaults.autoSelector = [YOUR-CLASS-NAME]; //single or double quoted class without the square brackets
</script>

不要忘记使用干净的代码编写。你错过了标签中的一些闭包。

这是显示工作代码的fiddle