JS多物体 任意值 链式 缓冲运动
更新时间:2012年08月10日 17:09:57 作者:
JS多物体 任意值 链式 缓冲运动,需要的朋友可以参考下
复制代码 代码如下:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" charset="utf-8" />
<meta http-equiv="content-type" content="text/html" />
<title>demo</title>
</head>
<style type="text/css">
ul,li,img{margin:0;padding:0;border:0;}
#list{height:250px;list-style-type:none;overflow:hidden;}
</style>
<body>
<div id="odiv" style="position:absolute;width:200px;height:100px;background:red;left:0;border:1px solid #333;"></div>
<script type="text/javascript">
var odiv=document.getElementById('odiv');
odiv.onmouseover=function(){
move(this,'width',500,function(){
move(odiv,'left',300,function(){
move(odiv,'height',500,function(){
move(odiv,'borderWidth',10)
})
})});}
function move(obj,arr,target,fn){
var dt=null,speed=0,ol=0;
clearInterval(dt);
dt=setInterval(function(){
ol=parseInt(obj.style[arr]);
if(ol==target){
clearInterval(dt);
if(fn) fn();
}else{
speed=(target-ol)/8;
speed>0?speed=Math.ceil(speed):speed=Math.floor(speed);
obj.style[arr]=ol+speed+"px";
}
},30);
}
</script>
</body>
</html>
相关文章
JavaScript创建对象方式总结【工厂模式、构造函数模式、原型模式等】
这篇文章主要介绍了JavaScript创建对象方式,结合实例形式总结分析了工厂模式、构造函数模式、原型模式等各种常见的javascript对象创建方式与相关操作注意事项,需要的朋友可以参考下2018-12-12JS循环遍历ul中li的点击事件给选中li添加css样式(示例代码)
对于一个ul中固定的li个数,当点击其中一个li时,改变选中li的颜色;同时改变对应的另一个ul中li的颜色,怎么实现这个功能呢,下面小编给大家带来了js循环遍历ul中li的点击事件,给给选中li添加css样式,感兴趣的朋友一起看看吧2023-07-07JS.GetAllChild(element,deep,condition)使用介绍
JS.GetAllChild()获取所有子节点,想必大家都知道吧,具体的使用方法如下,感兴趣的朋友可以参考下2013-09-09
最新评论