1

lu.style.opacity = lu.style.opacity += 0.01;
这是我的非 jquery 淡入功能的一部分,用于我想要具有淡入功能而不是 jquery 的页面。
我在函数上发出警报以查看不透明度是多少,并且每次都是 0.01,那为什么只添加一次呢?

我使用的功能

function fadein(lu,time){
if (lu.style.opacity<1)
  {
    lu.style.opacity = parseFloat(lu.style.opacity, 10) + 0.01; //add 0.01 to the opacity
    setTimeout(function(){fadein(lu,time)},time/100) //sets a timeout to the fadeIn function every time/100 miliseconds
  } 
}
4

5 回答 5

5

不透明度是一个字符串。添加到字符串时,您正在执行字符串连接。

console.log(typeof lu.style.opacity);
// "string"

确保您正在添加数字:

lu.style.opacity = parseFloat(lu.style.opacity) + 0.01;

如果 parseFloat 返回 NaN,这可能会有所帮助:

lu.style.opacity = (parseFloat(lu.style.opacity) || 0) + 0.01;

现在您没有看到值变化的原因是:

lu.style.opacity;
// originally empty string: ''
lu.style.opacity += 0.01
// translates to: lu.style.opacity = '' + 0.01
// which equals '0.01' which is valid, but when you do it again:
lu.style.opacity += 0.01
// it is doing this: lu.style.opacity = '0.01' + 0.01
// which is: '0.010.01'
// which is an invalid value for that css style so it retains the previous value of '0.01'
于 2013-10-01T18:35:30.950 回答
1
  1. 不透明度是一个字符串。
  2. 语法错误(即 +=)。

    lu.style.opacity = parseFloat(lu.style.opacity) + 0.01;

于 2013-10-01T18:35:52.863 回答
0

我认为你没有正确加起来

lu.style.opacity = parseFloat(lu.style.opacity) + 0.01;

正如@Pointy 评论的那样,尝试在你加起来之前和加起来之后发出警报。

于 2013-10-01T18:34:00.550 回答
0

我想你的意思是

lu.style.opacity += 0.01;

或者

lu.style.opacity = lu.style.opacity + 0.01;
于 2013-10-01T18:34:45.670 回答
0

将其放入while循环中以监控您向目标不透明度的进展:

var TARGET_OPACITY = 60.0;
while(lu.style.opacity < TARGET_OPACITY) {
    lu.style.opacity = parseFloat(lu.style.opacity, 10) + 0.01;
}
于 2013-10-01T18:37:20.670 回答