2015-09-04 2 views
0

Я начну с этого, сказав, что я не очень хорошо знаком с Cycle2, просто компания, с которой я работаю, случайно использует ее на своем сайте.JQuery 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 пива, и прокрутке.

ответ

0

Вы можете проверить 3 вещи:

  1. Включили ли вы карусельного cycle2 additionnal плагин? http://jquery.malsup.com/cycle2/download/

  2. Кажется, Cycle2 карусель совместим только с jquery1. Какая у вас версия jquery?

  3. Убедитесь, что вы загружаете карусельного плагин ПОСЛЕ cycle2

+0

JQuery является 1.9.2, и карусель загружается после cycle2. – SeanEnns

Смежные вопросы