jquery-cycle2 - Jqueryサイクル2カルーセルが機能せず、コンソールエラーが発生しない

Question

まったく活性化していません。プラグインのデモ ページにあるコードをそのままコピーしました。

<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>

Answer 1

サイクルでスライダーまたはカルーセルを自動アクティブ化するには、デフォルトのクラス名「cycle-slideshow」を使用する必要があります。それ以外の場合は、プラグインが検索するクラスを宣言する必要があります。

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

きれいなコードを書くことを忘れないでください。タグにクロージャーがありません。

これは、作業コードを表示するためのフィドルです。