Смешайте должным образом плагин Jquery Cycle и Jcarousel - PullRequest
1 голос
/ 26 февраля 2012

Я не могу правильно запустить плагин Jquery Cycle внутри моего слайдера (Jcarousel).

Моя проблема заключается в следующем: после скольжения изображения (это круговой слайдер), эффект Cycle делаетбольше не работает.

Есть идеи, чтобы решить эту проблему?

Заранее большое спасибо,

Вот код слайдера:

<script type="text/javascript">
function mycarousel_initCallback(carousel) {
jQuery('#mycarousel-next').bind('click', function() {
    carousel.next();
    return false;
});
};
jQuery(document).ready(function() {
if($('#mycarousel ul li').size()>4){
jQuery("#mycarousel").jcarousel({
    wrap: 'circular',
    scroll: 2,
    initCallback: mycarousel_initCallback,
    buttonNextHTML: null,
    buttonPrevHTML: null
});
}
});
</script>

Воткод плагина Jquery Cycle:

<script type="text/javascript">
$(document).ready(function(){ 
  $('.cycle').cycle({                            
        timeout: 500,
        speed:  1,
        delay:  1 
  }).cycle("pause").hover(function() {
        $(this).cycle('resume');
  },function(){
        $(this).cycle('pause');
  });
});
</script>

Вот HTML:

<div id="mycarousel" class="jcarousel-skin-tango">
            <ul>
                <?php while (have_posts()) : the_post(); ?>
                <li>
                    <div class="grid_3">

                        <div class="cycle">
                            <?php
                            $args = array(
                                'post_type' => 'attachment',
                                'orderby' => 'menu_order',
                                'order' => ASC,
                                'post_status' => null,
                                'post_parent' => $post->ID,
                            );
                            $attachments = get_posts($args);
                            if ( $attachments ):
                                foreach ( $attachments as $attachment ):
                                    echo wp_get_attachment_image($attachment->ID, 'medium');
                                endforeach;
                            endif;
                        ?>
                    </div><!-- .cycle -->


                </div><!-- .grid_3 -->
            </li>
            <?php endwhile; ?>
        </ul>
        <div class="jcarousel-scroll">
            <a href="#" id="mycarousel-next"><img src="<?php bloginfo( 'template_directory' ); ?>/images/slider.png" alt="" /></a>
        </div><!-- .jcarousel-scroll -->
    </div><!-- #mycarousel -->

1 Ответ

0 голосов
/ 18 октября 2012

Вы должны использовать версию 2 цикла

Пример:

http://jquery.malsup.com/cycle2/demo/carousel.php

http://jquery.malsup.com/cycle2/demo/caro-pager.php

...