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 src="p_w_picpaths_pd/zj1.jpg" /></a></li><li><a href="#"><img src="p_w_picpaths_pd/zj2.jpg" /></a></li><li><a href="#"><img src="p_w_picpaths_pd/zj3.jpg" /></a></li><li><a href="#"><img src="p_w_picpaths_pd/zj4.jpg" /></a></li> <li><a href="#"><img src="p_w_picpaths_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>
一个小例子,有点乱,有空修改下。
保健食品申报流程
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。