檢測頁面縮小

Question

我正在用Javascript寫一個網頁。我必須以某種方式處理我的DIV圖層屬性，請參閱頁面縮放。

我該怎麼做？您可以在​​頁面找到示例。嘗試縮放它並查看頂部菜單。

Answer 1

您應該對所有尺寸都使用EM，因此所有元素都會縮放（僅當啓用字體大小縮放時）。因此，您可以測量元素的字體大小，以瞭解文本縮放是否被修改。

有沒有辦法知道，如果頁面被瀏覽器或縮放沒有（爲我寫的，只有在使用的文字縮放）

這裏是一個workaroud：它只會如果字體 - 工作尺寸被縮放 http://jsfiddle.net/gGdAq/4/

基本上，如果您感興趣的元素的像素寬度不是基本字體大小*頁面被縮放的em寬度。

也許這個問題可以幫助： Catch browser's "zoom" event in JavaScript

Answer 2

編輯：我想縮放意味着大小調整窗口。你的意思是放大和縮小，我的不好。

---

蘋果網站上的頂級菜單是固定的，不會隨着瀏覽器窗口大小的調整而擴展。如果你想有一個功能，你將不得不分配：

div { 
    width: %; //percentage value you want 
    min-width: px; //the minimum pixel value you want 
} 

這樣，它擴展和與頁面寬度減小，但仍保持一分鐘寬度可讀性

此外，使用em作爲font-size將有助於保持文字大小的動態。

Answer 3

您幾乎在任何網站上都會遇到這種（或類似）行爲。沒有在任何其他瀏覽器中測試過，但here是我對firefox相同問題的回答。