复制代码 代码如下:
<!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>
<!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>
标签:
多物体,任意值,链式
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件!
如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
暂无“JS多物体 任意值 链式 缓冲运动”评论...
更新动态
2024年11月13日
2024年11月13日
- 群星《华语贺年金曲》K2HD[WAV+CUE][697M]
- 群星《酒廊夜色美》2CD[DTS-WAV]
- 群星《2024好听新歌35》AI调整音效【WAV分轨】
- 神秘园《讲故事的人》2019[FLAC+CUE/整轨]
- 张智霖VS许秋怡.1991-现代爱情故事【永高创意】【WAV+CUE】
- 忧欢派对.1988-忧欢派对【飞碟】【WAV+CUE】
- 群星.2009-他的沧海遗珠精选(金碟铁盒珍藏系列)【SONY】【WAV+CUE】
- 刘德华《经典金曲》[WAV+CUE][833M]
- 邓丽君《千言万语》SACD德国限量版[低速原抓WAV+CUE][1G]
- 王闻VS曼里《不老情歌》经典粤语情歌[低速原抓WAV分轨][1G]
- 英雄联盟faker有多少联赛冠军 faker联赛冠军数量介绍
- 炉石传说酒馆战棋分数等级段位介绍 酒馆战棋分数最新等级划分一览
- 野狗子奇才三姐怎么收集 野狗子奇才三姐收集攻略
- 香港群星《电影歌曲101》6CD[WAV整轨]
- 发烧民乐-心灵乐赏系列4CD[WAV+CUE整轨]