如何加載與無形的項目，直到jQuery的.fadeToggle頁面（）被觸發？

我有以下代碼：如何加載與無形的項目，直到jQuery的.fadeToggle頁面（）被觸發？

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $("button").click(function(){ 
    $(".hint").fadeToggle("slow", "linear"); 
    }); 
    }); 
    </script>

我想用.hint類的所有元素最初不可見的按鈕被點擊，直到。

我該如何做到這一點？

來源

2012-03-06 John Smith

添加到您的CSS：

.hint 
{ 
display:none; 
}

或者，如果要隱藏這與jQuery的onload，然後添加以下：

$(".hint").hide();

這將去後直接$(document).ready()，如：

$(document).ready(function(){ 
$(".hint").hide(); 
$("button").click(function(){ ....

來源

2012-03-06 22:48:34 Curt

你的第二個選項是行不通的，因爲這將是*的onload *，這是不是他要求（是最初不可見的） – steveoh 2012-03-06 22:53:49

'$（文件）。就緒（）'在負荷運行雖然這樣會隱藏它？ – Curt 2012-03-06 22:55:42

*的onload *或*準備當文件已準備就緒*將被觸發，即所有的CSS解析。它會顯示一會兒。可能會縮短以獲得差異..！編輯：我已經重讀了jquery文檔。它是在DOM構建之後（這會導致短時間的可見性）。 – steveoh 2012-03-06 22:59:05

在你的CSS，只需將一個display: none你定義你的類提示。 fadeToggle將使用直接附加到元素的自定義樣式來覆蓋它。

來源

2012-03-06 22:48:36 steveoh

謝謝大家！學習了幾種不同的方法！ – 2012-03-06 22:55:07

然後接受其中一個答案並將此問題標記爲已解決。 – steveoh 2012-03-06 22:56:38

定義CSS

.hidden { 
    display: none; 
}

並將其添加到您的HTML元素，

<.... class="hint hidden" ...>

或者只是除非你是在其他地方使用.hint，你這是添加display: none到.hint CSS定義可見。

這樣的元素是隱藏的負載。

來源

2012-03-06 22:48:51

有沒有在你的代碼，以使它們隱藏起來，所以你必須讓他們藏在css..change CSS

來源

2012-03-06 22:48:59 charlietfl

做到這一點的好方法是定義一個CSS類.hidden

那麼你可以addClass或removeClass與jQuery類，你甚至可以toggleClass。

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("button").click(function(){ 
     $(".hint").toggleClass("hidden"); 
     // if you want to preserve the fadeToggle just add display:none to the .hint css class 
     }); 
    }); 
</script>

CSS：

.hidden{ 
    display:none; 
}

在你的HTML你要隱藏的類添加到.hint元素，使他們最初隱藏。

<div class="hint hidden"></div>

來源

2012-03-06 22:49:41 1b0t

如何加載與無形的項目，直到jQuery的.fadeToggle頁面（）被觸發？

回答

相關問題