为什么我的代码没反应 是吧之前的offset改成getStyle之后就没动静了
一个人一首歌0
2016-10-09 13:47
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>多物体运动1</title>
<style type="text/css">
*{margin: 0; padding: 0;}
ul,li{list-style: none;}
li{
font-size: 20px;
font-style:italic;
width: 200px;
height: 100px;
background: lawngreen;
margin-top: 30px;
position: relative;
cursor: pointer;
border: 2px solid red;
}
span{
display: block;
position: absolute;
right: 3px;
}
#span{
display: block;
float: right;
font-size: 500px;
top: 0px;
}
</style>
<script type="text/javascript">
window.onload=function(){
var li=document.getElementsByTagName("li");
for(var i=0;i<li.length;i++){
li[i].timer=null;
li[i].onmouseover=function(){
startmove(this,400);
}
li[i].onmouseout=function(){
startmove(this,200);
}
}
function getStyle(obj,attr){
if(obj,currentStyle){
return obj.currentStyle[attr];
}
else{
return getComputedStyle(obj,false)[attr];
}
}
function startmove(obj,Itarget){
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var cur=parseInt(getStyle(obj,'width'));
var speed=(Itarget-cur)/20;
speed=(speed>0)?Math.ceil(speed):Math.floor(speed);
if(Itarget==cur){
clearInterval(obj.timer);
}else{
obj.style.width=cur+speed+"px";}
},30);
}
}
</script>
</head>
<body>
<ul>
<li><span>我</span></li>
<li><span>爱</span></li>
<li><span>你</span></li>
<li><span>呀</span></li>
</ul>
<span id="span">?</span>
</body>
</html>
3回答
-
- 你好西蒙
- 2016-10-09 14:44:33
getStyle里面的if(obj,currentStyle)，应该是用点号if(obj.currentStyle)
-
- LanceChou
- 2016-10-09 14:51:26
第一行复制错了，是if里的obj分号改为 .
-
- LanceChou
- 2016-10-09 14:45:43
function startmove(obj,Itarget){这里的obj的后面分号 , 改为 . function startmove(obj.Itarget){
JS动画效果
113925 学习 · 1443 问题
相似问题