在JavaScript調用淡入之前，我可以隱藏div嗎？

我在我的頁面上有一個div，並使用JavaScript來隱藏它，直到用戶單擊文本字段。這將淡入div。我遇到的問題是當頁面加載div快速閃爍在頁面上，然後隱藏。有沒有辦法，我可以設置我的div默認情況下隱藏，然後只有當用戶點擊文本區域然後div出現？目前它在頁面加載時閃爍一會兒，然後隱藏。在JavaScript調用淡入之前，我可以隱藏div嗎？

Iv'e嘗試將CSS樣式設置爲display:none;，但這意味着該div完全不會淡入。

<script> 
$(".search_prompt").hide(); 
$(function() { 
    $(".search_prompt").hide(); 
    var focusin_flag = false, 
    focusout_flag = false; 
    $("#text").focusin(function() { 
     if (!focusin_flag) { 
      $(".search_prompt").show(); 
      focusin_flag = true; 
     } 
    }).focusout(function() { 
     if (!focusout_flag) { 
      $(".search_prompt").hide(); 
      focusout_flag = true; 
     } 
     function timeout_init() { 
      setTimeout('search_prompt()', 2000); 

     } 

    }); 
});   
</script>

這裏是我的CSS：

.search_intro { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 11px; 
    color: #181469; 
    background-image: url(../img/icons/info-icon.png); 
    background-repeat: no-repeat; 
    background-position: 12px center; 
    border: #CCC 1px solid; 
    margin-top: 87px; 
    margin-left:460px; 
    position: absolute; 
    width:198px; 
    height:80px; 
    background-color:#FFF; 
    -moz-box-shadow: 0px 1px 8px #CCC; 
    -webkit-box-shadow: 0px 1px 8px #CCC; 
    box-shadow: 0px 1px 8px #030303; 
    z-index:100; 
    display:none; 
}

來源

2013-02-16 John James

可能是未加載DOM並執行腳本。你可以使用$（document）.ready（function（）{/ *在這裏做所有的東西* /}）;更多信息http://api.jquery.com/ready/ – vikingmaster 2013-02-16 08:45:21

它可能閃爍，因爲外部的CSS尚未加載。嘗試通過內聯css隱藏它：

<div style="display: none">...</div>

因此最終它是不可見的，而其餘的CSS加載。

來源

2013-02-16 08:42:13

但如果我顯示沒有，它不會在jquery中加載 – 2013-02-16 09:02:30

在JavaScript調用淡入之前，我可以隱藏div嗎？

回答

相關問題