<body>
<div>
<div></div>
<div>
<ul>
<li><img src="https://pic25.nipic.com/20121121/2969675_091845785000_2.jpg" /></li>
<li><img src="https://pic23.nipic.com/20120818/9715349_114354586392_2.jpg" /></li>
<li><img src="https://pic20.nipic.com/20120329/9715349_154806479182_2.jpg" /></li>
<li><img src="https://pic20.nipic.com/20120329/9715349_162301568121_2.jpg" /></li>
<li><img src="https://pic23.nipic.com/20120824/9715349_160522342186_2.jpg" /></li>
<li><img src="https://pic23.nipic.com/20120824/9715349_160651385195_2.jpg" /></li>
<li><img src="https://pic20.nipic.com/20120329/9715349_163520278182_2.jpg" /></li>
<li><img src="https://pic23.nipic.com/20120827/9715349_110350505124_2.jpg" /></li>
</ul>
</div>
<div></div>
</div>
<script>
/**
* @para obj 内容对象
* @para lbtn 左按钮
* @para rbtn 右按钮
* @para w 每次滚动的宽
* @para duration 每次运行时间
* @para tween 缓动类型
*/
function scOnce(obj, lbtn, rbtn, w, autotime, duration,tween){
var am = new animation(_ul),
step=0,
ulen = obj.scrollWidth,
timmerm
dr = 'left',
that = this;
// 最右端?
function isr(){
return parseInt($util.dom.getStyle(obj, 'left')) >=0;
}
// 最左端?
function isl(){
return ulen - Math.abs(parseInt($util.dom.getStyle(obj, 'left')))-10 <= w;
}
if(isr()&&isl())
return;
// 左移
this.goleft = function (){
step += -1*w;
am.go({left:step+"px"},duration,tween).start();
}
// 右移
this.goright = function (){
step += w;
am.go({left:step+"px"},duration,tween).start();
}
// 注册左按钮事件
$util.evt.addEvent(lbtn,'click',function(){
isl()? that.goright():that.goleft();
})
// 注册右按钮事件
$util.evt.addEvent(rbtn,'click',function(){
isr()? that.goleft():that.goright();
})
$util.evt.addEvent(rbtn,'mouseover',function(){
clearTimeout(timmer);
})
$util.evt.addEvent(lbtn,'mouseover',function(){
clearTimeout(timmer);
})
$util.evt.addEvent(rbtn,'mouseout',function(){
timmer = setInterval(auto,autotime);
})
$util.evt.addEvent(lbtn,'mouseout',function(){
timmer = setInterval(auto,autotime);
})
function auto(){
if(isl()){
dr = "right";
}
if(isr()){
dr = "left";
}
that['go'+dr]();
}
timmer = setInterval(auto,autotime);
}
var _ul = document.getElementsByTagName('ul')[0],
lbtn = document.getElementById('leftbtn'),
rbtn = document.getElementById('rightbtn');
var startgo = new scOnce(_ul,lbtn,rbtn,430,3000,500,$util.tween.Quint.easeInOut);
</script>
</body>
</html>
您可能感兴趣的文章: