如何設置jQuery slideUp（）當頁面加載時隱藏元素的方法

Question

我使用slideUp和slideDown jQuery函數在單擊頁面後向下滑動文本的網頁上顯示圖像。在下面的代碼中，我將js設置爲執行此操作，但是當我加載頁面時，文本已經停止。幻燈片功能的作品，但我希望加載與隱藏/文本的文字。

有關我如何修改代碼以在頁面加載時隱藏文本的任何建議將非常感謝。提前感謝您抽出時間看看這個！

下面的代碼：

jQuery(document).ready(function($) { 
    $(".pic").click(function(e) { 

var more = $(this).find('.more'); 

if ($(more).is(':visible')) { 
    $(more).slideUp('fast') 
} 
else { 
    $(more).slideDown() 
} 
$('.more').not($(more)).slideUp() 
}) 

}); 

Answer 1

你有兩個選擇。無論是設置初始.pic狀態，隱藏在你的CSS像這樣：

.more { 
    display: none; 
} 

或立即觸發設置回調，這是因爲他們是目前可見的，將其隱藏後你的JavaScript事件。這可以這樣做：

jQuery(document).ready(function($) { 
    $(".pic").click(function(e) { 
     var more = $(this).find('.more'); 

     if ($(more).is(':visible')) { 
      $(more).slideUp('fast') 
     } else { 
      $(more).slideDown() 
     } 
     $('.more').not($(more)).slideUp() 
    }).trigger('click'); 
});