CSS-Übergang - erleichtert das Einsteigen, erleichtert das Aussteigen aber nicht?

Question

Mar 12, 2014, 02:17 AM

CSS-Übergang - erleichtert das Einsteigen, erleichtert das Aussteigen aber nicht?

Ich habe ein kleines Problem mit meinen Bildern, wie hier gezeigt (http://jsfiddle.net/garethweaver/Y4Buy/1/).

.img-blur:hover {
  -webkit-filter: blur(4px);
  transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  -webkit-transition: all 0.35s ease-in-out;
  -o-transition: all 0.35s ease-in-out;
  -ms-transition: all 0.35s ease-in-out;
}

<img src="http://i.imgur.com/Vp5StNs.png" class="img-blur">

Das Bild wird unscharf, wenn die Maus schwebt, aber wenn ich die Maustaste loslasse, wird es wieder normal. Wie kann ich die Unschärfe beseitigen?

Gibt es auch eine Möglichkeit, Text anzuzeigen, wenn die Maus darüber bewegt wird? Wenn der Benutzer den Mauszeiger über das Bild hält, soll es unscharf werden und dann Text wie "Weitere Informationen" anzeigen. Ist das auch mit nur CSS möglich?

Prost