2014-09-12 196 views
3

CSS有命令過濾,它有很多功能的例子:CSS3過濾器不會在Opera,IE瀏覽器,Mozilla Firefox瀏覽器工作

filter: grayscale(0); 
    filter: sepia(0); 
    filter: saturate(1); 
    filter: hue-rotate(0deg); 
    filter: invert(0); 
    filter: opacity(1); 
    filter: brightness(1); 
    filter: contrast(1); 
    filter: blur(0px); 

器支持Chrome的18 +,Safari 6以上。 (來源:http://css3.bradshawenterprises.com/filters/

我需要使用灰度,棕褐色,飽和度,亮度,對比度,模糊。我不能使用任何的這個,因爲一些瀏覽器(例如,Mozilla瀏覽器,歌劇)不支持過濾

我的問題:也許這個功能有替代品或其他什麼東西來獲得類似的結果,如:灰階,棕褐色,飽和度,亮度,對比度,模糊

我嘗試什麼: 加前綴:-moz-, -o-, -ms-

從微軟官方網站的例子東西,但不工作:/來源:http://msdn.microsoft.com/en-us/library/ms532847(v=vs.85).aspx)是這樣的:

filter:progid:DXImageTransform.Microsoft.MotionBlur(strength=50) 
     progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1); width=50% 

有趣的是。我找到了Internet Explorer的解決方案:6,7,8(來源:http://www.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/)我嘗試爲我測試Internet Explorer 11,但它不起作用。代碼:

filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1'); /* IE6 & IE7 */ 
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1')"; /* IE8 */ 

我需要找到一個至少與

+1

過濾器完全是一個IE瀏覽器,它永遠不會在其他瀏覽器中工作 – Teo 2014-09-12 13:29:57

+2

Opera不支持帶「-webkit」前綴的過濾器。我在Opera上,[this](http://cssdeck.com/labs/visual-effects-in-css3-using-filters)演示對我來說工作正常。 – Harry 2014-09-12 13:32:51

+0

Teo,我的過濾器在Chrome瀏覽器和Safari瀏覽器上工作,但不適用於ie,mozilla和opera – Asker 2014-09-12 13:37:34

回答

1

Mozilla Firefoxsupport without prefix is coming in Firefox 34 according to MDN(目前穩定版本爲32)。幾周後,如果我理解的很好,你需要通過url()來使用SVG過濾器。注:如果您支持Firefox ESR - 擴展支持版本 - 可能會由不少IT部門和組織部署,則Fx 24 ESR在2014年10月後將不再受支持,但Fx 31 ESR將持續到中期或結束2015我猜。 (source

2

http://caniuse.com/#search=filter

從我可以告訴最新版本的Mozilla中,歌劇,Internet Explorer中運行的解決方案,不支持CSS濾鏡效果在IE一直到IE v11。 Firefox有部分支持。 Opera v24及以上版本都支持-webkit-前綴。

+1

也許Opera是okey,但基本問題是Internet Explorer和Mozilla。 – Asker 2014-09-12 13:40:23

相關問題