Jquery Cycle2只显示单张图片

Question

我会先说我对Cycle2不是很熟悉，只是说我正在为其工作的公司恰好在他们的网站上使用它。

无论如何，它不再显示旋转木马中的多个图像，不知道为什么。这是一个WordPress集成。

http://www.wolfbrewingcompany.com/beers/core-range/

下面是从页面调用滑块

<div class="post" id="post-<?php the_ID(); ?>"> 

    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/javascripts/jquery.cycle2.carousel.js"></script> 
    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/javascripts/jquery.cycle2.swipe.js"></script> 
    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/javascripts/ios6fix.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 

     $('.beers-slideshow').cycle(); 

     //$('.beers-slideshow .beer_name').hide(); 
     $('.beers-slideshow img') 
     .mouseenter(function() { 
      $(this).parent().next().show(); 
     }) 
     .mouseleave(function() { 
      $(this).parent().next().hide(); 

     }); 

    }); 
    </script> 

    <div class="beers_bg"> 
    <div class="beers_wrapper"> 

      <?php 
       $count = 0; 
       $html = ''; 
       if(have_rows('beer_slider')): 
       while (have_rows('beer_slider')) : the_row(); 

       $html .= '<div> 
        <a href="'.get_sub_field('beer_url').'"><img src="'.get_sub_field('beer_image').'" width="270" height="530" alt="'.get_sub_field('beer_name').'" /></a> 
        <div class="cycle-overlay"> 
         <div class="beer_name">'.get_sub_field('beer_name').'</div> 
        </div> 
       </div>'; 
       $count ++; 
       endwhile; 
       endif; 
      ?> 

      <div class="beers-slideshow" 
      data-cycle-fx="carousel" 
      data-cycle-timeout="0" 
      data-cycle-pause-on-hover="true" 
      data-cycle-slides="> div" 
      data-cycle-carousel-visible="<?php echo $count < 3 ? $count : 3 ?>" 
      data-allow-wrap="false" 
      data-cycle-carousel-fluid="false" 
      data-cycle-swipe="true" 
      data-cycle-next=".beers-next" 
      data-cycle-prev=".beers-prev" 
      > 
      <?php echo $html ?> 
     </div><!-- end of .beers-slideshow --> 

     <?php if ($count > 3): ?> 
     <span class="beers-prev"></span> 
     <span class="beers-next"></span> 
     <?php endif ?> 

    </div><!-- end of .beers_wrapper --> 
    </div><!-- end of .beers_bg --> 

</div><!-- end of div post --> 

应该显示3啤酒，并通过滚动的代码。

Answer 1

您可以检查三两件事：

1. 你拥有包括旋转木马循环2其它附加插件？ http://jquery.malsup.com/cycle2/download/

2. 看来Cycle2轮播仅与jquery1兼容。什么是你的jQuery版本？

3. 确保装入旋转木马插件后循环2