这段代码move.js 为什么没办法使用。哪里出错了?
function getStyle(obj,attr){
if(obj.currentStyle){
return obj.currentStyle[attr];
}
else{
return obj.getComputed(obj,false)[attr];
}
}
function startMove(obj,json,fn){
clearInterval(obj.timer);
//设置标杆
var flag=true;
//开启定时器
obj.timer=setInterval(function(){
var icur=0;
//获取当前值
//遍历json
for(var attr in json){}
if(attr=='opcity'){
icur=Math.round(parseFloat(getStyle(obj,attr))*100);
}
else{
icur=parseInt(getStyle(obj,attr));
}
//计算速度。
var speed=(json[attr]-icur)/8;
speed=speed>0?Math.ceil(speed):Math.floor(speed);
//检测停止。
if(icur!=json[attr]){
return flag=false;
if(attr=='opcity'){
//针对IE浏览器
obj.style.filter='alpha(opcity+'+(icur+speed)+')';
//针对firefox/chrom浏览器
obj.style.opacity=(icur+speed)/100;
}else{
obj.style[attr]=icur+speed+'px';
}
}else{
return flag=ture;
}
if(flag){
clearInterval(obj.timer);
if(fn){
fn();
}
}
},30);
}
//html部分
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>淘宝网便民服务JS动画效果</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
#move{
overflow:hidden;
border:3px solid #A19494;
margin:100px auto;
width:400px;
height:300px;
background-color: hotpink
}
a{
color:green;
font-weight: bold;
font-family: "微软雅黑";
margin: 20px;
display: inline-block;
padding-top:70px;
height:40px;
width:80px;
text-align: center;
position: relative;
text-decoration: none;
border:2px solid blue;
background-color: white;
}
a:hover{
color: #97F405;
text-decoration:underline;
}
i{
position: absolute;
top:30px;
left:25px;
margin: auto 0px;
filter:alpha(opacity:100);
opacity: 1;
}
#move img{
border:none;
}
</style>
<script src="move.js"></script>
<script >
window.onload=function(){
var oMove=document.getElementById('move');
var List=oMove.getElementsByTagName('a');
for(var i=0;i<List.length;i++){
List[i].onmouseover=function()
var _this=this.getElementsByTagName('i')[0];
startMove(_this,{top:-35,opacity:0},function(){
_this.style.top=35px;
startMove(_this,{top:30px,opacity:1});
});
}
}
}
</script>
</head>
<body>
<div id="move">
<a href="#"><i>
<img src="http://img1.sycdn.imooc.com//58ef31870001b76100240024.jpg">
</i><p>华为手机</p></a>
<a href="#"><i>
<img src="http://img1.sycdn.imooc.com//58ef318700019e0900240018.jpg">
</i><p>苹果手机</p></a>
<a href="#"><i><img src="http://img1.sycdn.imooc.com//58ef318700016c4500240022.jpg"></i><p>小米手机</p></a>
<a href="#"><i>
<img src="http://img1.sycdn.imooc.com//58ef3188000159a200240021.jpg">
</i><p>魅族手机</p></a>
<a href="#"><i>
<img src="http://img1.sycdn.imooc.com//58ef31880001f25500240022.jpg">
</i><p>金立手机</p></a>
<a href="#"><i>
<img src="http://img1.sycdn.imooc.com//58ef31a20001e01800240020.jpg">
</i><p>三星手机</p></a>
</div>
</body>
</html>