Wie man einen CSS 3 Unschärfefilter auf einen Text/ein Bild für den Internet Explorer oder IE 11 anwendet

Ich habe versucht, unten in meinem CSS Text zu verwischen, aber es funktioniert auf Chrome, Mozilla & Safari nur. Ich möchte, dass dies auch auf IE 11 funktioniert. Können Sie eine Alternative vorschlagen?Wie man einen CSS 3 Unschärfefilter auf einen Text/ein Bild für den Internet Explorer oder IE 11 anwendet

Ich möchte nicht StackBlur Lösung anwenden, da es Leistung enorm behindern wird, habe ich viele Orte auf einer Seite zu verwischen.

.blurry-text { 
text-shadow: 0 0 5px rgba(255, 255, 255, 0.00); 
-webkit-filter: blur(5px); 
background: filter: url('/media/blur.svg#blur'); 
filter: blur(5px); 
filter: progid: DXImageTransform.Microsoft.Chroma(color=#333333), progid: DXImageTransform.Microsoft.MotionBlur(strength=0, direction=0), progid: DXImageTransform.Microsoft.Blur(pixelradius=5); 
color: transparent; 
}

Quelle

2016-09-23 Dhrubo

Leider ist Unschärfe auf IE nicht aufgepflanzt. Schau [hier] (http://caniuse.com/#search=filter%3A%20blur). Ich denke nur Lösung ist die Verwendung [StackBlur] (https://github.com/flozz/StackBlur) – ciurciurek

@ciurciurek okay, danke für Ihren Kommentar und Link. Aber wenn ich die StackBlur-Implementierung für meine Seite verwende, muss ich dies für mehr als 50 Orte anwenden und die Anzahl kann wachsen. Daher mache ich mir wirklich Gedanken über das Leistungsproblem. Ich denke, dass nachdem ich das Vorhandensein der IE-Engine überprüft habe, ich entweder ein unscharfes Bild oben auf diesen Bereich setzen oder den StackBlur-Effekt einmal anwenden und dasselbe für den gesamten Bereich anwenden kann. Obwohl es aus verschwommener Perspektive nicht hundertprozentig genau wäre. Jede weitere Meinung? – Dhrubo

Ich weiß nicht, was Sie tun, aber vielleicht können Sie über eine andere Logik für IE nachdenken. Zum Beispiel ersetzen Aktien durch Blured Stocks. Leider beantworte ich jetzt keine spezifische Antwort auf Deine Frage. Viel Glück! – ciurciurek

Sie könnten Unschärfefilter mit SVG Gaußsche Unschärfe machen! Es ist Arbeit mit sind modern browsers.
Steuerung der Intensität der Unschärfe von stdDeviation="4"

Demo

See also

<div class="container" style="height: 613px;"> 
 
    <svg id="mySVG" width="100%" height="100%" viewBox="0 0 1131 591"> 
 
     <filter id="blurMe"> 
 
      <feGaussianBlur in="SourceGraphic" stdDeviation="4" /> 
 
     </filter> 
 
     <image filter="url(#blurMe)" xlink:href="http://static1.squarespace.com/static/56d70b042b8dde104d998bda/t/56d9b7e827d4bdab535a3af8/1457109282817/kiddos.jpg?format=1500w" x="0" y="0" height="100%" width="100%"/> 
 
    </svg> 
 
</div>

Quelle

2016-09-23 07:08:08

Wie man einen CSS 3 Unschärfefilter auf einen Text/ein Bild für den Internet Explorer oder IE 11 anwendet

Antwort

Verwandte Themen