Ich frage mich, ob es eine Möglichkeit gibt, eine Gaußsche Unschärfe mit jQuery (oder CSS, das jQuery modifizieren kann) auf ein div anzuwenden. Ich habe in Unschärfe () geschaut, aber zumindest bei Safari scheint es nicht das zu sein, wonach ich suche. Wenn möglich, möchte ich fadeIn auf den Effekt anwenden, damit es nach und nach unscharf wird.
Danke für jede Hilfe!
Beachten Sie, dass Blur ist, wenn ein DOM-Element wie Textfelder (Eingaben usw.) den Fokus verliert und nicht mit der Art von Unschärfe vermischt werden soll, über die Sie sprechen (Gaußsche / Bewegungsunschärfe).
Es gibt keine gute Cross-Browser-Lösung für dieses Problem. Sie können jedoch Bilder mit einer API wie der von Ben vorgeschlagenen verwischen. Oder indem Sie diesen verwenden .
Vielleicht, wenn Sie eine Möglichkeit finden, Ihren div-Inhalt auf einen HTML5-Canvas zu zeichnen, können Sie den Blur-Filter anwenden, indem Sie Pixastic ?
Es wurde hier nicht erwähnt, dass wir eine Hervorragender realistischer Unschärfeeffekt für Text mit CSS3 text-shadow . Und, (ja, natürlich!) Können wir feste Hintergründe und Ränder mit box-shadow verwischen (Schatten und mehrere Schatten sind erlaubt, weißt du).
Ich hoffe also, dass Sie in den meisten Fällen einen realistischen Unschärfeeffekt erzielen können, indem Sie kombinieren:
1) Bildunschärfe mit Leinwand
2) Textunschärfe mit text-shadow
3) Voller Hintergrund und Ränder verschwimmen mit box-shadow
4) habe ich noch etwas vergessen? ....
PS: Ich glaube, dass es nicht möglich ist, eine magische Klasse zu schreiben, die HTML verwischt.
Die Einschränkungen, die nicht überwunden werden können: Verwischen Sie den Rand des Bildes, verwischen Sie eingebettete Medien
Tags und Links javascript html jquery css blur