jQuery的 - 在調整大小

創建靈活的寬度我想擁有靈活的寬度，我的意思是，當我嘗試自動調整窗口，我的窗戶寬度的變化（根據窗口寬度），而不刷新jQuery的 - 在調整大小

我想這樣做我的樣品中文件，我該如何做到這一點？

我的樣本文檔：

<!DOCTYPE html > 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
<script> 

$(document).ready(function() { 
    var Ww = $(window).width() 
    var Wh = $(window).height() 
    $('.test').css({"width":Ww+"px","height":Wh+"px"}); 
}); 
</script> 
<style> 
* { 
    margin:0; 
    padding:0; 
} 
.test { 
    background-color:#000; 
} 
</style> 
</head> 
<div class="test"></div> 
<body> 
</body> 
</html>

來源

2013-10-27 AliM

-1

您可以通過CSS，無需使用jQuery它的做到這一點。

.test { 
    width: 100%; 
    height: 100%; 
    position: absolute; 
}

但是，如果你還有什麼理由通過jQuery這樣做，你需要添加的功能。

<script> 
$(window).resize(function() { 
    var Ww = $(window).width() 
    var Wh = $(window).height() 
    $('.test').css({"width":Ww+"px","height":Wh+"px"}); 
}); 

$(document).ready(function() { 
    var Ww = $(window).width() 
    var Wh = $(window).height() 
    $('.test').css({"width":Ww+"px","height":Wh+"px"}); 
}); 
</script>

來源

2013-10-27 19:28:18

我不想使用CSS，因爲在我的網頁許多動作都使用jQuery – AliM

好吧，如果你堅持，我已經添加了jQuery的代碼。希望有所幫助:) –

謝謝，但它只適用於頁面調整大小時，所以當你第一次運行打開頁面沒有調整大小，它什麼也沒有顯示 – AliM

function resizer(){ 
    var Ww = $(window).width(), 
     Wh = $(window).height(); 
    $('.test').css({width:Ww, height:Wh}); 
} 

$(function(){ // DOM READY 
    resizer(); 
}); 

$(window).resize(function(){ 
    resizer(); 
});

來源

2013-10-27 19:52:03

Thankyou，它工作正常:) – AliM

有沒有什麼辦法可以在document.ready中使用resizer沒有問題？ – AliM

@AliM我不認爲我理解你的問題。在我的示例中，您具有DOM就緒功能（只需縮短） –

jQuery的 - 在調整大小

回答

相關問題