为了账号安全,请及时绑定邮箱和手机立即绑定

这段代码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>


正在回答

1 回答

注释为“检测停止”那段代码,把if里的return去掉

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

这段代码move.js 为什么没办法使用。哪里出错了?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信