能帮我看下我的代码吗, 会出现小数不精确的现象,好着急求问

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

小喜蛋

2014-11-25 15:53

<!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" xml:lang="en">

<head>

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

<title>js透明度动画</title>

<style type="text/css">

 body{

  margin:0px;

 }

 #div1{

  width:200px;

  height: 200px;

opacity: 0.3;

/* filter:alpha(opacity:30); */

background: red;

 }

</style>

<script type="text/javascript">

window.onload=function(){

var odiv=document.getElementById("div1");

odiv.onmouseover=function(){

startmove(1);

}

odiv.onmouseout=function(){

startmove(0.3);

}

}

var timer=null;

var alpha=0.3

function startmove(iTarget){

var odiv=document.getElementById("div1");

clearInterval(timer);

timer=setInterval(function(){

var speed=0;

if (alpha>iTarget) {

speed=-0.1;

}

else{

speed=0.1;

}

if(alpha==iTarget){

clearInterval(timer);

}

else{

alpha+=speed;

/*odiv.style.filter='alpha(opacity:'+alpha+')'*/

odiv.style.opacity=alpha;

}

},30)

}

</script>

</head>

<body>

<div id="div1"></div>

</body>

</html>



写回答 关注

2回答

  • 偌颜宁
    2014-11-25 16:21:27
    已采纳

    alpha+=speed;在这句话后面加这句话alpha = alpha.toFixed(1)*1;就可以了。

    我解释一下这句话的意思toFixed(1)是取小数点后一位数字,而该方法返回的是一个字符串,那么在JS中字符串转换成数值有两种方式,一个是这种:字符串*1可以得到数字,前提字符串中是纯数字,第二种是用parseInt()的方法去转换,这里我比较懒,就用的第一种

    vis_焦虑...

    感谢,但是这里parseInt()应该是parseFloat().

    2016-04-21 23:02:26

    共 4 条回复 >

  • 快乐的小牛妞
    2014-11-27 10:06:34

    这节还没有讲到小数精确的问题,此课程是一点一点的渗透。。可以看一下Math 对象方法


JS动画效果

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

113925 学习 · 1443 问题

查看课程

相似问题