The commonly used scrolling focus image effect code in shopping malls is simple and practical_jquery

< ;script type="text/javascript">
$(function(){
var len = $(".num > li").length;
var index = 0;
var adTimer;
$(".num li").mouseover(function(){
index = $(".num li").index(this);
showImg(index);
}).eq(0).mouseover();
//Slide in to stop animation, slide out to start animation.
$('.ad').hover(function(){
clearInterval( adTimer);
},function(){
adTimer = setInterval(function(){
showImg(index)
index ;
if(index==len){index=0; }
}, 3000);
}).trigger("mouseleave");
})
// Display different slides by controlling top
function showImg(index) {
var adHeight = $(".content .ad").height();
$(".slider").stop(true,false).animate({top : -adHeight*index}, 1000);
$(".num li").removeClass("on")
.eq(index).addClass("on");
}