$(document).ready(function(){	
		$.fn.cycle.updateActivePagerLink = function(pager, currSlideIndex) { 
			$(pager).find('#pg'+currSlideIndex).removeClass('slide_nav_off') 
				.filter('#pg'+currSlideIndex).addClass('slide_nav_on'); 	
		}; 				   
						   
		$('#slider') 
		.after('<div id="slider_nav2"  class="slider_nav">') 
		.cycle({ 
			fx:     'fade', 
			timeout: 6000, 
			delay:  -2000,
			pager:  '#slider_nav2', 
		pagerAnchorBuilder: function(idx, slide) { 	
			return '<div class="slide_nav_off" align="left" id="pg'+idx+'"><a class="slider_'+textArray[idx]+'" href="#"></a></div>'; 
		},
		before:  function(idx){
			//remove all old selections
			for(i=0;i<textArray.length;i++){
				if(i!=idx){
					$('#slider_nav2').find('#pg'+i).removeClass('slide_nav_on').addClass('slide_nav_off');
				}
			}			
		}
		});
});