运行了没有反应,请问哪里出了问题?

来源:2-2 JS透明度动画

慕粉1703136593

2017-03-07 14:34

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style style="text/css">

*{padding:0;margin:0;}

#tmd{width:300px;height:300px;

     background:green;

filter:alpha(opacity:30);

opacity:0.3;

}

</style>

<script>

window.onload=function(){

var adiv=document.getElementById("tmd");

adiv.onmouseover=function(){startmove(100);}

adiv.onmouseout=function(){startmove(30)}}

var timer=null,

var alpha=30;

function startmove(itarget){

var adiv=document.getElementById("tmd");

clearInterval(timer);

timer=setInterval(function(){

var speed=0

if (alpha>itarget){

var speed = -10

}

else{

var speed = 10

}

if (alpha == itarget) {

clearInterval(timer)

}

else

{alpha =alpha+speed;

adiv.style.filter='alpha(opacity:+"alpha"+)';

adiv.style.opacity=alpha/100;

}

},30)

}

</script>

</head>

<div id="tmd"></div>

<body>

</body>

</html>


写回答 关注

3回答

  • 白小九
    2017-03-07 15:53:03
    已采纳

    书写不规范,错误太多:

    var timer=null,
    var alpha=30; // 上一行结尾是逗号,这一行就不要写var了

    再比如:

    adiv.style.filter='alpha(opacity:+"alpha"+)'; // 单引号和双引号乱用;而且加号怎么在引号里?

    ……

    自己仔细检查一下哈

    慕粉1703...

    非常感谢!

    2017-03-07 16:09:05

    共 1 条回复 >

  • 慕粉1813158878
    2017-03-07 15:50:24

    http://img.mukewang.com/58be65c80001553919200112.jpg

    你的代码运行报错;

    http://img.mukewang.com/58be65e300018f6f05860149.jpg

    var timer = null , alpha = 30;

    或者

    var timer = null ;

    var alpha = 30 ;

    还有就是楼上说的对: 这里 if(){}else{}语句里面直接写speed就可以,前面不用加var变量声明了

  • 非常有喜
    2017-03-07 15:40:29

    timer=setInterval(function(){

    var speed=0

    if (alpha>itarget){

    var speed = -10

    }

    else{

    var speed = 10

    }

    这里 if(){}else{}语句里面直接写speed就可以,前面不用加var变量声明了

    慕粉1703...

    试了,还是不行

    2017-03-07 15:47:01

    共 1 条回复 >

JS动画效果

通过本课程JS动画的学习,从简单动画开始,逐步深入各种动画框架封装

113925 学习 · 1443 问题

查看课程

相似问题