我想通過調整窗口

我試圖隱瞞與jQuery一個div用下面的代碼隱藏一個div：我想通過調整窗口

$(window).resize(function(){ 
    if (window.innerHeight < 750) { 
    $("footer").animate({'height' : '0px'}, 500); 
    } 
    if (window.innerHeight > 750) { 
    $("footer").animate({'height' : '35px'}, 500); 
    } 
});

我已經在Chrome測試，它只能使用一次。它只會消失，不會再出現調整大小。

在我的代碼中有錯誤還是錯誤的解決方案？

謝謝您的期待！

來源

2013-07-15 Lumoris

你只想要JS解決方案還是對媒體查詢開放？ –

resize事件持續發生，所以動畫並非如此。 – adeneo

簡單的方法是使用一個媒體查詢：https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

舉例來說，如果你有#divOne的ID，你的風格的股利爲正常，並添加一個單獨的媒體查詢作爲display: none;用於當窗口縮小到指定的寬度。在這種情況下，在div隱藏當窗口的寬度低於600像素：

#divOne {display: block; height: 200px; background: #000; } 

@media (max-width: 600px) { 
    #divOne { 
    display: none; 
    } 
}

來源

2013-07-15 21:01:03

讓我試試:) – Lumoris

完美的作品，謝謝！ – Lumoris

很高興幫助。隨意標記爲正確的答案。我需要代表！ –

這意味着該條件if (window.innerHeight > 750) {從不執行瀏覽器因爲是window.innerHeight小於750要查看控制檯的值記錄它這樣：

console.log(window.innerHeight);

來源

2013-07-15 21:07:03

這裏是jQuery的執行情況：

假設你想隱藏div1當窗口寬度小於750px並再次顯示它，如果窗口寬度爲g reater比750px

HTML

<div id="div1"> 
</div>

CSS

#div1{ 
    width:100%; 
    padding:30px; 
    background:#1d1d1d; 
}

jQuery的

$(window).resize(setDivVisibility); 
function setDivVisibility(){ 
    if (($(window).width()) < '750'){ 
    $('#div1').css('display','none'); 
    } else { 
    $('#div1').css('display','block'); 
    } 
}

工作jsfiddle：http://jsfiddle.net/a8V9V/

來源

2013-07-15 21:15:22 Learner

我想通過調整窗口

回答

相關問題