Hallo,
ein Mitglied von mir hat sich gewünscht, dass die Avatarbilder, wenn man mit der Maus darüber fährt, größer werden. Gibt es so eine Erweiterung schon oder kann mir jemand sagen, wie ich das umsetzen kann?
Hallo,
ein Mitglied von mir hat sich gewünscht, dass die Avatarbilder, wenn man mit der Maus darüber fährt, größer werden. Gibt es so eine Erweiterung schon oder kann mir jemand sagen, wie ich das umsetzen kann?
Frag mal @mipu, wie er das in seinem Forum umgesetzt hat. Ich könnte es Dir vermutlich auch erklären, müsste aber erst nachsehen.
Gruß norse
.message .messageSidebar .userAvatar > a > img {
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
transition-duration: 0.8s;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
transition-property: transform;
overflow:hidden;
}
.message .messageSidebar .userAvatar > a > img:hover
{
-webkit-transform:scale(2.1);
-moz-transform:scale(2.1);
-o-transform:scale(2.1);
}
Alles anzeigen
Vielen Dank
Ich empfehle noch einen z-index: 102; zur unteren Deklaration .message .messageSidebar .userAvatar > a > img:hover hinzuzufügen (ansonsten wird das vergrößerte Avatar durch andere Elemente überdeckt).
Ich wollte nämlich schon sagen, dass man die anderen Elemente noch sieht
Ich empfehle noch einen z-index: 102; zur unteren Deklaration .message .messageSidebar .userAvatar > a > img:hover hinzuzufügen (ansonsten wird das vergrößerte Avatar durch andere Elemente überdeckt).
Funktioniert aber nur im FF, im Chrome, leider nicht, wenigstens bei mir nicht.
Stimmt eben mit Chrome getestet. Dort werden die Elemente nicht verdeckt.
Dann muss es womöglich in die erste Deklaration. Ich habe es tatsächlich auch nur im Firefox getestet.
Dann muss es womöglich in die erste Deklaration.
Hab ich schon getestet geht auch nicht
Ihr seid echt Klasse
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!