这篇文章主要介绍了jquery实现的图片点击滚动效果,需要的朋友可以参考下
需要添加jquery文件才可以调试
复制代码 代码如下:
<script type="text/javascript" src="https://www.jb51.net/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></div>
<div>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<div></div>
</div>
您可能感兴趣的文章: