2013-05-26 31 views
1

這很難解釋...如果使用CSS縮放(和縮放)縮小(小於1),在資源管理器9和10中,仍將其內容區域視爲具有其原始大小。例如資源管理器:使用變換縮小後刪除剩餘的空白:scale

transform:scale(0.5); 
    width:200%; 

將被視爲200%寬,即使它顯示爲100%寬。 讓我在小提琴證明這一點:

http://jsfiddle.net/pike/CAbcH/

我看到IE10水平和垂直滾動條。使用「縮放」代替具有相同的效果。

如何解釋資源管理器它不需要超出內容的滾動條? jquery解決方案也是可以接受的。

+0

在safari中它應該是100%的寬度,但是當我滾動時,有一個白色的100%區域在下面。 – bwoebi

+0

這是由於'overflow:auto'刪除它,它會修復它。什麼是你需要在現實生活中添加'overflow:auto' – Vector

+0

的特殊原因,如果內容超過100%/ scale,我需要滾動條。是的,我需要'溢出:自動';我需要滾動條,但我希望它們是正確的。 – commonpike

回答

3

這裏有一個解決方案 - http://jsfiddle.net/pike/YmfGC/

並非所有整齊,使用瀏覽器嗅探,它basicly寫在變焦DIV的包裝<div>,只有IE瀏覽器,使用寬度()和高度()後發現瀏覽器渲染頁面...

+0

接受我自己的答案。多少點,那麼給我:-) – commonpike

+0

ofcourse,瀏覽器嗅探不會在IE11工作了。該瀏覽器被稱爲「三叉戟」。 – commonpike

0

我改變了溢出:隱藏在#scroll和overflow:auto:on #zoomed(即基本上顛倒它們的溢出),使滾動功能正常 - 這是你在找什麼?雖然我有一個問題,你爲什麼需要這些尺度,因爲你可以使它看起來就像你想用CSS一樣。

+0

你的意思是,就像在這個小提琴中一樣? http://jsfiddle.net/pike/3c4KJ/?不,你不能這樣做,因爲(在大多數瀏覽器中)滾動條本身也會被縮放 - 例如,看着那個小提琴在鉻上,看到非常奇怪的薄滾動條。在Firefox中,它更糟。滾動容器需要包裹縮放容器...... – commonpike

+0

'爲什麼你需要有尺度' - 這只是一個小提琴。在真正的應用程序中,規模是由jquery動態設置的。我希望容器大小保持不變,但內容要放大和縮小。當小提琴演示時,縮小是一個問題。 – commonpike

+0

我只能得到它在firefox和chrome上正常工作,但不IE:(在IE上它沒有縮小200%的寬度和高度,也許,jQuery是要走的路(?) – Jennift