jquery 鼠标经过效果实例

<div class="cont"><script type="text/javascript">$(function(){var size = $('.zjbtn li').length;var frist = 0;var datetime;$('.zjbtn li').mouseover(function(){frist = $('.zjbtn li').index(this);showpic(frist); }).eq(0).mouseover();$('.main4 .main4_r .cont').hover(function(){clearInterval(datetime); },function(){datetime = setInterval(function(){showpic(frist)   frist++;   if(frist==size){frist=0;}},3000);}).trigger('mouseleave'); function showpic(frist){ var imgheight = $('.main4 .main4_r .cont').width(); $('.zjpic').stop(true,false).animate({left:-imgheight*frist},600)  $('.zjbtn li').removeClass('hover').eq(frist).addClass('hover'); }; });</script><div class="zjpic"><ul><li><a href="#"><img class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="images_pd/zj1.jpg" /></a></li><li><a href="#"><img class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="images_pd/zj2.jpg" /></a></li><li><a href="#"><img class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="images_pd/zj3.jpg" /></a></li><li><a href="#"><img class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="images_pd/zj4.jpg" /></a></li> <li><a href="#"><img class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="images_pd/zj5.jpg" /></a></li></ul></div> <div class="zjbtn"> <ul><li class="hover"></li><li></li> <li></li> <li></li> <li></li></ul></div></div>

一个小例子，有点乱，有空修改下。

保健食品申报流程