的slideToggle菜單隱藏

我用以下的slideToggle菜單隱藏

$("#button").on("click",function(e){ 
    $("#nav").slideToggle(); 
});

到有滑下時，我的網頁在移動環境中觀看了導航。 #nav在CSS中顯示：none，因此當它點擊#button時，它具有display:block。但是，如果我不首先關閉導航（或重新登錄#button）並調整窗口大小，則#nav將保持display:block，並且顯示超過479px。我已經嘗試了一些沿線

$(window).resize(function() { 
    if($(window).innerWidth()>459 && $("#nav").css("display")!=none) $("#nav").hide(); 
});

它並沒有工作。有任何想法嗎？

來源

2013-07-23 wooskie

請張貼相關的HTML。 – Learner

您可能需要引用「none」，但我會使用.is（「：visible」）。 – isherwood

我的解決方案中有什麼會阻止您實施？ – Learner

嘗試在CSS中設置max-width（或常規width）至#nav。當div顯示時這將會生效。

編輯：這是隻有當你還想要div顯示，只是不擴大全寬。如果您希望窗口寬於459時消失，請參閱其他答案。

來源

2013-07-23 16:29:47 Yair

做這樣的事情：

HTML

<div id="nav"></div>

CSS

#nav{ 
    width:100%; 
    padding:30px; 
    background:#1d1d1d; 
    display:none; 
}

jQuery的

基於窗口的大小，我們會顯示以下DIV：

$(window).resize(setDivVisibility); 
function setDivVisibility(){ 
    if (($(window).width()) < '750'){ //change pixels to match your needs 
    $('#nav').css('display','block'); 
    } else { 
    $('#nav').css('display','none'); 
    } 
}

小提琴：http://jsfiddle.net/8m5By/（嘗試調整大小和股利會出現）

來源

2013-07-23 16:32:16 Learner

的slideToggle菜單隱藏

回答

相關問題