使用.slidetoggle讓div在頁面加載時再次展開和摺疊

嗨，大家好，我有一個div文本框，它隱藏起來，直到你點擊一個按鈕，然後.slideToggles打開它的高度，然後當你再次點擊它時，它會切換關閉。使用.slidetoggle讓div在頁面加載時再次展開和摺疊

現在我想要做的是在頁面加載框中展開，然後再次摺疊並停止（不自動重複），以便人們看到隱藏內容並點擊按鈕。有人能幫忙嗎？？我並不擅長jQuery。

這是我得到的。

 $(document).ready(function() { 

      $("#page-information").hide(); 
       $(".info-tab").toggle(function() { 
        $(".info-tab").addClass("info-active"); 
        }, function() { 
        $(this).removeClass("info-active"); 
       }); 
       $(".info-tab").click(function() { 
        $("#page-information").slideToggle('slow'); 
       }); 
      });

任何幫助將不勝感激。我以爲你可以在開始的時候連續做兩個幻燈片，但是並不明顯。

謝謝你們。

來源

2012-02-24 Alex M

不是每個人都看的頁面。不會有工具提示或某種方式指向它，他們可以關閉更好地滿足您的需求？ – Ben 2012-02-24 15:46:39

給這個一展身手：

$(document).ready(function() { 

    $("#page-information").slideDown('slow', function(){ 
     setTimeout("$('#page-information').slideUp('slow');", 500); 
    }); 
    $(".info-tab").toggle(function() { 
     $(".info-tab").addClass("info-active"); 
     }, function() { 
     $(this).removeClass("info-active"); 
    }); 
    $(".info-tab").click(function() { 
     $("#page-information").slideToggle('slow'); 
    }); 
});

它的實例工作：在加載http://jsfiddle.net/ufomammut66/yRqqq/2/

來源

2012-02-24 15:55:46 ShortRound1911

嘿男人！你是一個可愛的人！那很棒！在首頁加載時，您會看到它向下滑動然後備份，但之後在其他每個頁面上都會開始展開並摺疊。第一次加載頁面之前是否還可以強制下滑動？非常感謝尼克！非常非常感謝。 – 2012-02-24 16:08:27

只是爲了擴大尼克。你在jsfiddle上的代碼正好在我的地方加載打開然後崩潰。謝謝 – 2012-02-24 16:12:54

只需在黑暗中進行刺探，但這可能是您的CSS頁面信息元素。如果你打開我製作的JSFiddle，並改變＃page-information元素的css：'display：none;'到'顯示：塊';'你會注意到slideDown沒有執行。這是因爲slideDown只適用於未顯示的元素。當我們在顯示的元素上執行slideDown時，jQuery將此視爲完成 - 因此它只是執行回調函數 - 這是我們的slideUp。如果這不能解決您的問題 - 請發佈HTML和CSS您的使用。 – ShortRound1911 2012-02-24 16:44:49

也許這樣？

$(document).ready(function() { 

    $(".info-tab").toggle(function() { 
     $(".info-tab").addClass("info-active");} 
    }); 

    setTimeout(function(){ 
     $(".info-tab").toggle(function() { 
      $(this).removeClass("info-active"); 
      $("#page-information").slideToggle('slow'); 
     }); 
    }, 1000); 



     $("#page-information").hide(); 
      $(".info-tab").toggle(function() { 
       $(".info-tab").addClass("info-active"); 
       }, function() { 
       $(this).removeClass("info-active"); 
      }); 
      $(".info-tab").click(function() { 
       $("#page-information").slideToggle('slow'); 
      }); 
     });

來源

2012-02-24 15:50:04

使用.slidetoggle讓div在頁面加載時再次展開和摺疊

回答

相關問題