What I'm trying to do is make my slider continuously loop through the LIs, rather than scroll until it gets to the last item and then stop (which is what it currently does).
The following code is from a Wordpress site, so although it only displays one LI, there are infact about 6 or 7 outputted in the front-end:
PHP
<ul id="slideshowContainer" class="jcarousel jcarousel-skin-tango">
<?php $clientLogos = new WP_Query(array('post_type' => 'client-logos', 'posts_per_page' => -1)); ?>
<?php while ($clientLogos->have_posts() ) : $clientLogos->the_post(); ?>
<li>
<?php if (has_post_thumbnail( $post->ID )): ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' ); ?>
<img src="<?php bloginfo('template_directory'); ?>/thumbs.php?src=<?php echo $image[0]; ?>&h=100&zc=1" alt="<?php the_title(); ?>" />
<?php endif; ?>
</li>
<?php endwhile;?>
<div style="clear:both"></div>
</ul>
JS
jQuery(document).ready(function() {
jQuery('#slideshowContainer').jcarousel({
scroll: 1,
auto: .01,
wrap: 'last',
easing: 'linear'
});
});
Thanks!
Cant you just use
wrap: 'circular'
?
Use the 'wrap' option. Use the following as an example:
$('.jcarousel')
.jcarousel({
wrap: 'circular'
})
.jcarouselAutoscroll({
interval: 3000,
target: '+=1',
autostart: true
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With