0

我的页面大约需要一秒钟的时间来加载 html。有几个隐藏的 div 最初设置为 display:none,然后在正常使用期间通过 jquery toggle 访问。但是,当页面加载时,那些隐藏的 div 会闪烁大约半秒。如果页面是硬刷新的并且加载需要 3-4 秒,那么这些 div 会显示大约一两秒。我想知道是否有任何方法可以防止这种情况。如果看起来不好,我宁愿不要让它们闪烁第二次。页面的简化 html 是这样的。

<!DOCTYPE html>
<html>  
<head>      
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />       
    <title>Site - Home</title>      
    <link rel="stylesheet" type="text/css" href="style.css" />              
    <!--JQuery-->       
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>              
    <script type='text/javascript' src='javascript/popup.min.js'></script>  
</head>     

<body>      
    <a href="#" id="new-post">New Post</a>

    <!--Popup container-->
    <div id="new-post-box" class="popup" style="width:500px;">      
        blah            
    </div>

    <script type="text/javascript">/*popup function*/</script>              
</body>
</html> 

我不知道该代码是否必要,但可以防止显示 blah 的 div 出现在页面加载中。再次将其设置为 display:none 最初但我猜 css 加载时间比 html 稍晚

4

1 回答 1

0

确保 display:none 属性在文件的 css 中,而不是在 document.ready() 或其他脚本中。这应该可以缓解这个问题。

在上面的情况下(我猜你想隐藏 class='popup')所以在 CSS 中进行以下操作

.popup{
  display:none;
}
于 2013-03-18T02:00:44.970 回答