《简洁的jQuery banner图片轮播实例代码_.docx》由会员分享，可在线阅读，更多相关《简洁的jQuery banner图片轮播实例代码_.docx（5页珍藏版）》请在三一文库上搜索。
1、简洁的jQuery banner图片轮播实例代码_ 这篇文章主要介绍了简洁的jQuery banner图片轮播实例代码的相关资料,需要的伴侣可以参考下 html xmlns=l head title无标题页/title script src=js/jquery-2.1.4.js type=text/javascript/script style type=text/css .clearoverflow:hidden; clear:both; width:0px; height:0px; .imgboxwidth:640px; margin:0 auto; text-align:center;
2、ulpadding:0px; margin:0px; ul lifloat:left; list-style:none; ul li.selectdisplay:block; .imgnum spanborder-radius:10px; font:normal normal bold 12px/15px 微软雅黑; color:#FFF; margin-left:5px; padding:3px 6px 3px 6px; background-color:#F90; cursor:pointer; .imgnum span.onselectbackground-color:#F00; .im
3、gnumtext-align:center; float:right; margin:-30px 30px; position:relative; /style /head body div class=imgbox ul id=banner_img liimg src=images/banner1.jpg/li liimg src=images/banner2.jpg/li liimg src=images/banner3.jpg/li liimg src=images/banner4.jpg/li liimg src=images/banner5.jpg/li /ul div class=
4、clear/div div class=imgnum span class=onselect1/span span2/span span3/span span4/span span5/span /div /div script type=text/javascript var time = ; var index = 1; $(function () showimg(index); /鼠标移入移出 $(.imgnum span).hover(function () clearTimeout(time); var icon=$(this).text(); $(.imgnum span).remo
5、veClass(onselect).eq(icon-1).addClass(onselect); $(#banner_img li).hide().stop(true,true).eq(icon-1).fadeIn(slow); , function () index=$(this).text() 4 ? 1 :parseInt($(this).text()+1; time = setTimeout(showimg( + index + ), 3000); ); ); function showimg(num) index = num; $(.imgnum span).removeClass(
6、onselect).eq(index-1).addClass(onselect); $(#banner_img li).hide().stop(true,true).eq(index-1).fadeIn(slow); index = index + 1 5 ? 1 : index + 1; time = setTimeout(showimg( + index + ), 3000); /script /body /html 留意要引用 Jquery 文件，图片我就不放上来了，自己替换掉，留意图片长宽。 以上所述是我给大家分享的简洁的jQuery banner图片轮播实例代码，盼望对大家有所关心！ .