高手帮我看看怎么让这2个对象互不相关?
HTML code
<!DOCTYPE HTML>
<html>
<head>
<title> New Document </title>
<!--<script type="text/javascript" src="jquery-1.6.min.js">
</script>-->
<style type="text/css">
ul{list-style:none}
*{margin:0;padding:0;}
.list{width:600px;height:120px;position:relative;overflow:auto;margin:0 auto}
.list li{float:left;width:120px;height:120px; background:orange;margin-right:10px}
.list ul{position:absolute;top:0;left:0;}
</style>
</head>
<body>
<div id="list" class="list"><ul id="abc">
<li></li>
<li>das</li>
<li>dadf</li>
<li>dsaf4</li>
<li>sdafu</li>
<li>aa</li>
<li></li>
<li>das8</li>
<li>dadf</li>
<li>dsaf</li>
<li>sdafu</li>
<li>aa</li>
<li>aa23</li>
</ul>
</div>
<span id="next">next</span>
<span id="previous">previous</span>
<div id="list1" class="list"><ul id="abc1">
<li></li>
<li>das</li>
<li>dadf</li>
<li>dsaf4</li>
<li>sdafu</li>
<li>aa</li>
<li></li>
<li>das8</li>
<li>dadf</li>
<li>dsaf</li>
<li>sdafu</li>
<li>aa</li>
<li>aa23</li>
</ul>
</div>
<span id="next1">next</span>
<span id="previous1">previous</span>
<script type="text/javascript">
<!--
var arr = new Array();
var w =0;
var y=120;
var p=0;
var timer;
var to = 0;
var $ = function(id){return document.getElementById(id)};
var list = $("list");
var ul = list.firstChild;
window.onload = function(){
var li = ul.childNodes;
for(var i=0; i<li.length-1; i++){
if(li[i].nodeType == 3){
ul.removeChild(li[i])
}
arr.push(li[i]);
w = w+arr[i].offsetWidth;
}
con(ul)
}
function con(o){
var width=0;var height =0;
for(var i=0; i<arr.length;i++){
width = width+arr[i].offsetWidth+10;
if(arr[i].offsetHeight > height){
height = arr[i].offsetHeight;
}
}
o.style.width = width+"px";
o.style.height = height+ "px";
}
function autoScroll(dirNext,dirPrev,list){
this.dirNext = dirNext;
this.dirPrev = dirPrev;
this.list = list;
}
autoScroll.prototype={
next:function(){
$(this.dirNext).onclick= function(){
obj.runScroll(false)
}
},
prev:function(){
$(this.dirPrev).onclick= function(){
obj.runScroll(true)
}
},
runScroll:function(t){
var list = $(this.list);
switch(t){
case true:
if(p >= list.childNodes.length-6){
return false;
}
var g = -130*(p+1);
if(list.offsetLeft > g){
to = to + (g - list.offsetLeft) / 5;
list.style.left = parseInt(to) + "px";
timer = setTimeout(function(){
obj.runScroll(t)
},20)
}
else{
p++;
clearTimeout(timer);
}
break;
case false:
if(p <= 0){
return false;
}
var g = -130*(p-1);
if(list.offsetLeft < g){
to = to + (g - list.offsetLeft) / 5;
list.style.left = parseInt(to) + "px";
timer = setTimeout(function(){
obj.runScroll(t)
},20)
}
else{
p--;
clearTimeout(timer);
}
break;
}
}
}
var obj = new autoScroll("next","previous","abc")
obj.next();
obj.prev();
var obj = new autoScroll("next1","previous1","abc1");
obj.next();
obj.prev();
//-->
</script>
</body>
</html>