JQex1:廣告輪播

二、練習1:點選切換照片

結果

var $li = $('.title li').hover(
	function(){$(this).addClass('over').siblings('.over').removeClass('over');}
	,function(){$(this).removeClass('over');})
	.click(function(){
		$(this).add($('.AD div').eq($(this).index()))
            .addClass('on').siblings('.on').removeClass('on');
	});

jQuery add() 方法參考連結

var timer=window.setTimeout(move,1000);

//滑鼠移入時,停止循環照片
$('.AD').hover(
	function(){ window.clearTimeout(timer);}
	,function(){timer=window.setTimeout(move,1000);}
);

//控制輪播
function move(){
	var clickIndex = $('.title li.on').index();
		clickIndex = (clickIndex % $li.length)+1;
		$li.eq(clickIndex).click();
		timer=window.setTimeout(move,1000);
}