JQuery是一個快速、小巧、功能強大的 JavaScript 庫，使 HTML 頁面與 JavaScript 之間的簡潔的交互變得輕松愉悅。
而模態窗口是現在很多網頁都使用的一種交互方式，但是有時候窗口大小不太合適，這時候我們可以利用JQuery來動態調整模態窗口大小。

下面是一個簡單的例子：

<!--html代碼-->
<div id="myModal" class="modal">
<div class="modal-content">
<span class="close">×</span>
<p>這是一個模態窗口。</p>
</div>
</div>

//JQuery代碼
$(document).ready(function(){
//獲取模態窗口元素
var modal = document.getElementById("myModal");
//獲取關聯關閉按鈕元素
var span = document.getElementsByClassName("close")[0];
//當用戶點擊關閉按鈕時，關閉模態窗口
span.onclick = function() {
modal.style.display = "none";
}
//當用戶點擊模態窗口外部時，關閉模態窗口
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
//調整模態窗口大小
$(".modal-content").css("width","50%");
});

在JQuery代碼中，我們首先獲取到模態窗口元素，然后獲取到關聯的關閉按鈕元素，通過點擊事件關閉模態窗口。

接下來，通過獲取模態窗口中內容的類名來獲取模態窗口內容的元素，然后將其寬度設置為50%。

這樣我們就可以輕松地調整模態窗口大小了。