CSS相對縮放？

我正在使用php styleswitcher和備用樣式表來嘗試複製瀏覽器縮放（鍵盤cmd-plus或ctrl-plus）的功能。CSS相對縮放？

現在，圖形的「放大」被鏈接到一個備用樣式表與下面的CSS：

body { 
zoom: 1.2; -moz-transform: scale(1.2); -moz-transform-origin: 0 0} 
}

這工作得很好，但最好我想有鏈接觸發一個相對縮放而不是絕對縮放值 - 所以我需要建立一個變量，確定用戶的當前縮放級別，然後將該縮放比例提高120％。這種方式可以多次單擊相同的鏈接以增加縮放比例。

任何想法如何做到這一點？

來源

2012-02-12 Sarah

看到這裏http://stackoverflow.com/questions/2026294/zoom-css-javascript – LeeR 2012-02-12 18:33:06

刪除PHP標籤 - 更多的是CSS的問題（並沒有什麼真正的以上關於PHP）的 – MrJ 2012-02-12 18:37:29

是的，我看到了這個線程，但它沒有解決我的問題。我已經建立了我在這個鏈接線程中描述的樣式表，但我試圖找出如何讓它影響累計縮放。因爲它現在已經設置好了，點擊鏈接只會工作一次 - 一旦它加載了「縮放1.2」樣式表，它縮放了1.2倍，然後再次點擊它不會增加縮放。 – Sarah 2012-02-12 18:39:37

我認爲這將需要JavaScript。
如果我沒有記錯，可以使用JS來更改/創建CSS樣式。所以如果你在JS中保存一個變量，並且每次觸發鏈接的onClick時將它乘以1.2，它應該會產生相同的效果。

編輯：我不知道是否有可能，但如果你可以在LESS乘以變量，你可以'語言'。由於這是CSS &的組合JS

來源

2012-02-12 18:37:48 GroundZero

有沒有人有具體的建議如何做到這一點？我不知道足夠的JS來自己寫這個。 – Sarah 2012-02-12 18:41:15

請參見[如何檢測所有現代瀏覽器中的頁面縮放級別？]（http://stackoverflow.com/a/5078596/938089?how-to-detect-page-zoom-level-in-all-modern-browsers）用於檢測瀏覽器縮放級別的方法。然後，通過測量的瀏覽器縮放分割所需的縮放級別。最後，將更改應用於'document.body.style.zoom'（和'document.body.style [「 - moz-transform」]'，'document.body.style [「 - webkit-transform」]'你的願望。 – 2012-02-12 19:00:13

CSS相對縮放？

回答

相關問題