設置一個 div 來顯示：無； 使用 javascript 或 jQuery

Question

我有一個非常簡單的問題，應該很容易回答。

我有一個移動導航菜單，它使用 jQuery 來“向下鑽取”菜單級別。 每次加載一個關卡時，jQuery 都會確定菜單的高度，並相應地設置它。

我在按鈕上使用以下腳本來根據當前頁面切換顯示和隱藏主菜單：

<script type="text/javascript">
    (function ($) {
        $("a.BNnavTrigger").click(function (event) {
            event.preventDefault();
            $("div.drill-down-wrapper").slideToggle("9000");
        });
    })(jQuery);     
</script>

為了讓菜單在某些頁面上開始“關閉”，我知道我必須給出display:none;的 css 值display:none; 到包含 div。 這一切都很好，有一個小問題。

當我最初隱藏菜單時，jQuery 下鑽菜單插件檢測到它被隱藏，並將菜單高度設置為 0px。 當我在最初隱藏菜單的頁面上切換菜單時，窗格中的所有其他內容都正確切換，但菜單本身卡在 0 高度。

在我的大腦中，這個問題的明顯答案是在加載菜單並設置高度后，通過 javascript 隱藏包含菜單 div 。 這聽起來正確嗎？

誰能給我提供一個小腳本來做到這一點？ 我是一個完整的 js 菜鳥。 其他人對如何處理這個問題有不同的建議嗎？

謝謝你的時間！ 亞歷克斯

更新！

這里的問題的 JS 小提琴： http : //jsfiddle.net/fyyG2/17/ *

Answer 1

在文件准備好$("#yourId").hide(); .

例如：

$(document).ready(function () {

     $("div.drill-down-wrapper").hide();
     var $drillDown = $("#drilldown");

        // (what ever your code is)
 });

Answer 2

試試這個方法：

$("#yourId").css("display","none");

它應該工作！

我希望它有幫助。

Answer 3

將 css 值 display:none 添加到您的 css 文件中效果很好。 http://jsfiddle.net/dxkX6/4/

但我可以看到你的 html 文件中有一個錯字：

$("a.BNnavTrigger").click(function (event) {
       ^

<a class="BNavTrigger">Toggle Menu</a>
        ^

這可能是您遇到問題的原因嗎？

Answer 4

我不確定我是否完全理解你的問題，但這里有一個想法：

將要隱藏的內容的不透明度設置為 0，而不是更改其大小/隱藏它。 這樣它將保持其尺寸但不會被用戶看到：

$('#id').css('opacity',0);

並重新顯示元素：

$('#id').css('opacity',1);

Answer 5

嘗試：

$('#id').style = "display: none;"