css 可见性属性和 javascript setTimeout 方法出错

Error with css visibility property and javascript setTimeout method

本文关键字：setTimeout 方法 出错 javascript 可见性 属性 css      更新时间：2023-09-26

我必须让一个p元素在单击按钮时消失，而div元素滑过它。如果p元素已经不可见并且div已经在其上方，则单击按钮时，p应恢复可见，但在 1 秒后div滑出它。

第一部分工作正常，在第二种情况下，p的可见性属性上使用的 setTimeout 函数不起作用。

代码如下：

function slide_wiki(){
    var wiki=document.getElementById('wiki_bar');
    var p_vita=document.getElementById('vita');
    var width=wiki.style.width;
    slide(wiki, 100);
    if(width!='0%'){
        setTimeout(function(){p_vita.style.visibility='visible'}, 1000);
        wiki.style.borderRight='1px solid #E0E0E0';
    }else{
        p_vita.style.visibility='hidden';
        setTimeout(function(){
            wiki.style.borderRight='0px solid white';
        }, 900);
    }
}

我按照建议创建了一个 jsFiddle，但由于某种原因，幻灯片功能根本不起作用，仍然需要 css 和 javascript 在那里，所以无论如何它都应该有所帮助。http://jsfiddle.net/bigcola317/GRs3V/5/

由于我看不到您的代码，因此无法跟踪该错误。因此，我使用简单的css过渡制作了一个有效的解决方案。看看它是否适合您：http://jsfiddle.net/joplomacedo/V3yat/

解决了。问题是，如果"p"不可见，则在我单击按钮后，slide（） 将在"div"上执行 slide_close（） 函数，为"p"上的样式属性设置新值。我猜问题可能是样式属性可以覆盖在可见性属性上所做的设置，所以我尝试在 slide_close（） 函数中更改 setAttribute（） 方法：

p_vita.style.width="...";
p_vita.style.marginLeft="...";

这使它起作用。这不是很清楚，但无论如何谢谢:)

相关文章：