重置 SetInterval 以在另一个 ID 上重复该功能

Question

我在重置 2 个函数的 setInterval() 时遇到问题，它们应该被受影响的 ID 重用

继承人 javascript:

//Fuction Fade out
function fadeOut(elem, speed) {

if(!elem.style.opacity)
{
    elem.style.opacity = 1;
}

if(elem.style.opacity>=1){
    setInterval(function(){
        if(elem.style.opacity >=0){
            elem.style.opacity = parseFloat(elem.style.opacity) - 0.03;} 
        }, speed /50);
    if(elem.style.opacity >=1){
        clearInterval(0);

    }
}

}


//Função fade in
function fadeIn(elem, speed) {

if(!elem.style.opacity)
{
    elem.style.opacity = 0;
}

/*var timerId=*/
if(elem.style.opacity<=0){
    setInterval(function(){
        if(elem.style.opacity <=1){
            elem.style.opacity = parseFloat(elem.style.opacity) + 0.03;} 
        }, speed /50);
}
/*if(elem.style.opacity >="1"){
    clearInterval(timerId);
    return;} */
}

我已经尝试了一段时间来解决这个问题，但它没有帮助，当我在淡出功能上实施第三个 "if" 时，不透明度值下降，但没有回到 0 , 它变为 0,99。我能做什么？

Answer 1

clearInterval 需要间隔的名称来清除我认为，您需要将间隔命名为这样的变量：

var myInterval = setInterval(function(){
  if(elem.style.opacity >=0){
    elem.style.opacity = parseFloat(elem.style.opacity) - 0.03;
  } 
}, speed /50);

那么你可以这样清除它:

clearInterval(myInterval);

重置 SetInterval 以在另一个 ID 上重复该功能

Reset SetInterval to repeat the function on another ID

html

javascript

css

fadeout

fadein