Home > Categories > Rotations > Jcarousellite with pagination

Jcarousellite with pagination

 
1 2 3 4
  • content 1
  • content 2
  • content 3
  • content 4

Easy to design JQuery carousel slider. We made some changes to the Jcarousellite plugin to add the pagination to the scirpt. The script uses simple CSS feel free to design it the way you like.


HTML, CCS and JQuery code


<style type="text/css">



<script src="jquery-1.5.2.min.js" type="text/javascript"></script>
<script src="jcarousellite_1.0.1c5.js" type="text/javascript"></script>
<script type="text/javascript">

$(function() {
	$("#slidebox").jCarouselLite({
		vertical: false,
		hoverPause:true,
		btnPrev: ".previous",
		btnNext: ".next",
		visible: 1,
		start: 0,
		scroll: 1,
		circular: true,
		auto:1000,
		speed:500,				
		btnGo:
		    [".1", ".2",
		    ".3", ".4"],
		
		afterEnd: function(a, to, btnGo) {
				if(btnGo.length <= to){
					to = 0;
				}
				$(".thumbActive").removeClass("thumbActive");
				$(btnGo[to]).addClass("thumbActive");
		    }
	});
});
</script>

1 2 3 4
  • content 1
  • content 2
  • content 3
  • content 4

Add a comment...