Vergrößerung auf Faktor 1,5
img.icon {
-webkit-transition: -webkit-transform 0.4s ease-out; /* Saf3.1+, Chrome */
-moz-transition: -moz-transform 0.4s ease-out; /* FF3.5+ */
-o-transition: -o-transform 0.4s ease-out; /* Opera */
transition: transform 0.4s ease-out;
}
img.icon:hover {
-webkit-transform: scale(1.5); /* Saf3.1+, Chrome */
-moz-transform: scale(1.5); /* FF3.5+ */
-ms-transform: scale(1.5); /* IE9+ */
-o-transform: scale(1.5); /* Opera */
transform: scale(1.5);
}
Vergrößerung auf Faktor 5,0
img.icon {
-webkit-transition: -webkit-transform 0.4s ease-out; /* Saf3.1+, Chrome */
-moz-transition: -moz-transform 0.4s ease-out; /* FF3.5+ */
-o-transition: -o-transform 0.4s ease-out; /* Opera */
transition: transform 0.4s ease-out;
}
img.icon:hover {
-webkit-transform: scale(5); /* Saf3.1+, Chrome */
-moz-transform: scale(5); /* FF3.5+ */
-ms-transform: scale(5); /* IE9+ */
-o-transform: scale(5); /* Opera */
transform: scale(5);
}
Verkleinern auf Faktor 0,5
img.icon {
-webkit-transition: -webkit-transform 0.4s ease-out; /* Saf3.1+, Chrome */
-moz-transition: -moz-transform 0.4s ease-out; /* FF3.5+ */
-o-transition: -o-transform 0.4s ease-out; /* Opera */
transition: transform 0.4s ease-out;
}
img.icon:hover {
-webkit-transform: scale(0.5); /* Saf3.1+, Chrome */
-moz-transform: scale(0.5); /* FF3.5+ */
-ms-transform: scale(0.5); /* IE9+ */
-o-transform: scale(0.5); /* Opera */
transform: scale(0.5);
}
Bild horizontal spiegeln
img {
-webkit-transition: -webkit-transform 0.4s ease-out; /* Saf3.1+, Chrome */
-moz-transition: -moz-transform 0.4s ease-out; /* FF3.5+ */
-o-transition: -o-transform 0.4s ease-out; /* Opera */
transition: transform 0.4s ease-out;
}
img:hover {
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}