0

我一直在看这个 JS，我试图弄清楚为什么它没有任何效果。它应该 - 以指定的时间间隔运行该函数，并且直到某个元素的不透明度为 0，它应该不断降低该元素的不透明度。

在触发此间隔函数时，屏幕上没有任何反应。有没有人有任何想法？

setInterval(fadeover, 100);

function fadeover() {
    if (document.getElementById("rightopright").style.opacity > 0) {
        var curropac;
        curropac = document.getElementById("rightopright").style.opacity;
        document.getElementById("rightopright").style.opacity = (curropac - 0.1);
    }
}

我确定我在这里做了一些愚蠢的事情，但无法弄清楚什么......任何帮助将不胜感激！

4

2 回答 2

3

大概您没有为 inlineopacity属性设置默认值，因此它是一个空字符串（不是大于零的值）。

您需要针对这种情况进行测试：

function fadeover() {
    var el = document.getElementById("rightopright");
    var op = el.style.opacity;
    if (op === "") { 
        op = 1;
    }
    if (op > 0) {
        el.style.opacity = (op - 0.1);
    }
}

……或者忘记 JavaScript 动画，改用CSS 3 过渡。

于 2013-07-10T10:30:41.930 回答
1

除非您特别style="opacity:1"对元素本身有，theElement.style.opacity否则将是空字符串。空字符串不大于零，因此函数永远不会运行。

我可以建议以下内容：

function fadeOut(elem,time) {
    var opac = 1;
    setTimeout(function() {
        opac -= 0.1;
        elem.style.opacity = opac;
        if( opac > 0) setTimeout(arguments.callee,time/10);
    },time/10);
}
fadeOut(document.getElementById('rightopright'),1000);
于 2013-07-10T10:32:25.330 回答