$(document).ready(function () {
	$(".scrollable").scrollable({circular: true}).navigator();
	
	var n = $(".navi a").length; // 3 or 4 or 5.......
	var w = $(".navi a").width(); // 16 
	$(".navi").width(n*w);  // this code works, but want to change "48px" to var n
	 
	var t = $(".panel_tabs").length;
	var tw = $(".panel_tabs").width();
	$(".product_tabs").width(t*tw); 
	  
	 
	$('.lightbox a').lightBox();
	 
	  
	<!-- Cycle -->
 	$('#index_main_banner')
	.cycle({
		fx: 'fade', // choose your transition type, ex: scrollHorz, fade, scrollUp, shuffle, etc...
		pager:  '#slideshow_nav',
		pager_nav_points: '<a href="#"><img src="/images/clear.gif" width="2" height="5" border="0" /></a>', //2.81R function
		easing:'easeOutQuart',	
		speed:    1000, 
    	timeout:  5000,
		// next:   '#slideshow_next', // The next button element if exist
    	// prev:   '#slideshow_prev', // The prev button element if exist
		pause: 1 // pause on hover
	});	
		 
});