标题 | jquery实现的图片点击滚动效果 |
范文 | 代码如下: <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(function(){ //alert($('#findclose').closest('div').attr('id')); var pic_length = $('#gd li').length; var n = 0; $('#toleft').click(function(){ if (!$('#gd').is(':animated') && n) { $('#gd').animate({left:'+=120px'},500); n--; } }); $('#toright').click(function(){ if (!$('#gd').is(':animated') && pic_length > n+5) { $('#gd').animate({left:'-=120px'},500); n++; } }); }) </script> <style type="text/css"> ul{ list-style:none; margin:0px; padding:0px; text-align:center; } #gd li { width:90px; height:80px; display:block; float:left; margin:9px 15px; } </style> <div> <div id="toleft"></div> <div> <ul id="gd"> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> </div> <div id="toright"></div> </div> |
随便看 |
|
在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板,是学习及工作的有利工具。