濾波器：梯度和背景：固定

代碼：濾波器：梯度和背景：固定

body { background-attachment: fixed !important; filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#000000,endColorStr=#3d3c3c); }

梯度不保持固定在IE8但滾動到一個純白色背景。漸變在Firefox和Chrome中保持不變，並隨頁面一起滾動。

在IE8中有沒有辦法讓它變成fixed？我甚至不知道這是一個問題（根據谷歌找不到任何東西）。

編輯：我用上面的代碼創建了一個測試頁面（和很多Lorem Ipsum），並且背景被固定了。所以它必須是我的佈局中的東西。

來源

2011-02-17 Zydeco

我有IE 8.0.6001.18702和使用你的代碼，滾動內容，漸變保持固定爲我。我從來沒有看到過白色的背景。由於所使用的過濾器只能在IE中工作，因此我認爲您用於Firefox和Chrome的方法並不相關。你能提供一個演示你的問題的小提琴嗎？ – Nimrod 2011-02-17 02:05:54

相關可能不會，但非常煩人，因爲Moz和Webkit的樣式以我想要的方式工作。 http://jsfiddle.net/g83DW/爲小提琴，但真的我不知道它之間的代碼我上面發佈和那之間有什麼區別。雖然我會說，即使小提琴是一個很好的例子，因爲漸變從預覽的頂部到底部，並且滾動而不是在「窗口」中顯示整個漸變並保持固定。 – Zydeco 2011-02-17 02:17:17

看起來你所缺少的就是在身體上設置一個高度。添加這種風格在IE 8爲我工作：

html, body {height: 100%}

因此，使用你的風格，從你的小提琴，它應該是這樣的：

html, body {height: 100%} 
body { 
    background-attachment: fixed !important; 
    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#000000, endColorstr=#ffffff); 
}

而且這是跨瀏覽器版本看起來像：

html, body {height: 100%} 
body { 
    background-attachment: fixed !important; 
    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#000000, endColorstr=#ffffff); 
    background-image: -moz-linear-gradient(center top -90deg, #000000, #ffffff); 
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#000000), to(#ffffff)); 
}

很明顯，你可以把IE特定代碼的其他地方，並有條件地加載它，等

在IE 8，Firefox 3.6，Chrome 9中測試得很好Safari 5（Webkit），但在Opera中不起作用。對於Opera，SVG或實際背景圖片？

來源

2011-02-17 18:44:09 Nimrod

濾波器：梯度和背景：固定

回答

相關問題