首页 新闻 会员 周边

怎么让滚动条移到最后就结束..

0
悬赏园豆:10 [已解决问题] 解决于 2012-05-09 00:06

要是li的个数不确定的情况下.
然后移动滚动条到最后,让ul列表也同时在最后.改怎么计算啊?

<!DOCTYPE HTML>
<html>
<head>
<title>soul42</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<STYLE type="text/css">
*
{ margin:0; padding:0;}
body
{width:100%;height:100%;}
#wrap
{width:550px;height:8px;background:#ccc;margin:55px auto;position:relative}
#move
{position:absolute;top:0;left:0;width:50px;height:8px;background:red;}
#list
{width:550px;height:100px;overflow:hidden;position:relative;margin:0 auto}
#list ul
{position:absolute;top:0;left:0;height:100px;}
#list ul li
{width:100px;margin-right:10px;background:orange;height:100px;float:left;display:inline}
</STYLE>

</head>




<body>

<div id="list">
<ul id="ul">
<li>1</li>
<li>2</li>
<li>3</li>
<li></li>
<li>4</li>
<li>5</li>
<li>7</li>
<li>4</li>
<li>5</li>
<li>r32</li>
<li>4</li>
<li>5</li>
<li>9</li>
<li>10</li>
<li>4</li>
<li>5</li>
<li>r</li>
<li>s</li>
<li>5</li>
<li>9</li>
<li>w</li>
</ul>
</div>

<div id="wrap">
<div id="move">
</div>
</div>


<script type="text/javascript">
var $ =function(id){return document.getElementById(id)}
var list = $("ul").getElementsByTagName("li");
$(
"ul").style.width = ((list[0].offsetWidth+10)*list.length) +"px";

var div = $("move");
var i=0;
div.onmousedown
=function(e){
var posX = e.clientX-this.offsetLeft;
document.onmousemove
=function(e){
var x = e.clientX - posX;
div.style.left
= x+"px";
$(
"ul").style.left = parseInt("-"+(x*2)) +"px";
console.log(x)
if(div.offsetLeft <0 ){
div.style.left
="0px";
}
if(div.offsetLeft > ($("wrap").offsetWidth -div.offsetWidth)){
div.style.left
= ($("wrap").offsetWidth-div.offsetWidth) +"px";
}
}
document.onmouseup
=function(){
document.onmousemove
=null;
}
}
</script>

</body>
</html>
深蓝色梦想的主页 深蓝色梦想 | 初学一级 | 园豆:6
提问于:2011-12-01 12:29
< >
分享
最佳答案
0

ul.left=ul.clientWidth*(move.left/(wrap.width-move.width))

收获园豆:10
王那个锋啊 | 菜鸟二级 |园豆:311 | 2012-01-12 11:12
其他回答(1)
0

帮顶!

superlandmxj | 园豆:130 (初学一级) | 2011-12-05 10:18
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册