jQuery scrollLeft问题

[d_evil_f]

我想做的是，我点击按钮，ul就向左多移动1000，就可以展示里面的图片，可是无论怎么点击，都不起作用啊！！
这是我的css代码
.contain
{
margin:0px auto;
width:960px;
}
.contain2
{
margin-top:10px;
overflow:hidden;
width:960px;
height:146px;
}
.box
{
width:9999px;
}
.box li
{
float:left;
width:180px;
height:144px;
border:1px solid red;
margin-left:5px;
overflow:hidden;
}
这是html代码:
<div class="contain">
<div class="contain2">
<ul class="box">
<li><img src="products/01.jpg"/></li>
<li><img src="products/02.jpg"/></li>
<li><img src="products/03.jpg"/></li>
<li><img src="products/05.jpg"/></li>
<li><img src="products/06.jpg"/></li>
<li><img src="products/07.jpg"/></li>
<li><img src="products/08.jpg"/></li>
</ul>
</div>
<input type="button" value="click" />
</div>
这是js代码：
$(function () {
$("button").click(function () {
$("ul").scrollTop(1000)
});
});
求大神帮帮忙！

[天际的海浪]

因为你是滚动操作，是改变整个元素中滚动条的位置，所以是对设置了overflow属性的元素进行操作。 如果要对box操作，就不能是滚动操作了，是移动操作 $(".box").css("left","-1000px") 移动操作还要对元素和父元素设置position: relative/absolute/fixed;

[d_evil_f]

引用 2 楼 jslang 的回复:

$(function () {
    $(":button").click(function () {
        $(".contain2").scrollLeft(1000)
    });
});

为什么不是用这个box的移动来做的啊？

[d_evil_f]

我是新入门js的

[天际的海浪]

$(function () {
    $(":button").click(function () {
        $(".contain2").scrollLeft(1000)
    });
});