JCarouselLite not showing all images/links properly

JCarouselLite not showing all images/links properly

I use JCarouselLite to slide accross all the images/link in my page. 6 of
them are displayed on the page by default, but after clicking the Next
button some time, no images that should be additionaly displayed are
showing. Then, after some time clicking Next button, they are displayed
right (see image). Could somebody help me with this? Thanks in advance.

Code:
<div id="cat_slider">
<div id="cat_slider_inside">
<ul class="cat_slider_inside">
<?php foreach ($categories as $cat) : ?>
<li>
<a href=...>
<img src="<?php echo z_taxonomy_image_url($cat->term_id);
?>" />
<span><?php echo $cat->name; ?></span>
</a>
</li>
<?php endforeach; ?>
</ul><!-- end .cat_slider_inside -->
</div><!-- end #cat_slider_inside -->
</div><!-- end #cat_slider -->
<!-- Categories Slider Buttons -->
<a href="#" class="md-prev-button"></a>
<a href="#" class="md-next-button"></a>
JQ:
$(function() {
// Load the categories sliders
$('#cat_slider_inside').jCarouselLite({
btnNext: '.md-next-button',
btnPrev: '.md-prev-button',
visible: 2
});
});