將圖像調整爲與JavaScript全屏？

您是否可以使用與Flash相同的方式將圖像大小調整爲全屏javascript？將圖像調整爲與JavaScript全屏？

伊夫發現這個鏈接，但它與幻燈片整個插件，等不只是功能，我需要一個更定製設計： http://buildinternet.com/project/supersized/

理想的id喜歡用jQuery來做到這一點。謝謝

2011-05-23 Evans

下面是一個基本實現的例子。它考慮了窗口的大小調整，但沒有考慮到圖像的任何焦點，因此焦點可能會超出窗口的大小。

編輯：我忘點說，所述圖像上的寬度/高度屬性是必要在這個版本中爲所有瀏覽器（特別是野生）來計算圖像的縱橫比。如果您的圖像是動態的，並且尺寸不可用，那麼可以在綁定到窗口的「加載」功能內計算這些尺寸。

2011-05-23 14:49:27 amustill

嗨amustill，你能解釋的代碼是如何工作的？ js是否檢測瀏覽器的窗口大小，然後製作這個大小的圖像？或者，還有更多嗎？謝謝 – Evans 2011-05-23 15:03:59

稍微多一點。它首先計算圖像尺寸和縱橫比，以便我們使用它來計算最終的圖像尺寸。 resizeImage（）函數然後檢測瀏覽器尺寸，檢查縱橫比並相應地調整圖像尺寸，使其總是成比例的。 – amustill 2011-05-23 15:07:34

圖像實際上是div格式，所以我可以使用jQuery來獲取div大小並將其應用爲圖像寬度的css？圖像將會在html而不是背景圖像中。我記得，如果你用css設置圖像的高度爲自動，然後改變寬度，它將調整大小保持正確的尺寸。謝謝 – Evans 2011-05-23 15:29:49

是的。我不明白你爲什麼不能，真的。您可以使用JavaScript及其DOM接口來修改圖像的樣式屬性以調整圖像大小。你甚至不需要像jQuery這樣沉重的庫;這都是原生的。

2011-05-23 14:22:01

如何：

$(window).resize(function() { 
    $('#myImgId').width($(window).width()); 
    $('#myImgId').height($(window).height()); 
});

它不會保持寬高比...

2011-05-23 15:16:16 toby

謝謝，但生病需要保持寬高比。 – Evans 2011-05-23 15:26:37

回答