Я не могу правильно запустить плагин 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 -->