to { opacity: 0; }
}
+img {
+ -webkit-transform-origin: top left;
+ -ms-transform-origin: top left;
+ transform-origin: top left;
+}
+
.rot90 {
- rotation: 90deg;
- -webkit-transform: rotate(90deg);
- -moz-transform: rotate(90deg);
- -o-transform: rotate(90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
+ -webkit-transform: rotate(90deg) translateY(-100%);;
+ -moz-transform: rotate(90deg) translateY(-100%);;
+ -o-transform: rotate(90deg) translateY(-100%);;
+ rotation: 90deg translateY(-100%);;
}
.rot180 {
- rotation: 180deg;
- -webkit-transform: rotate(180deg);
- -moz-transform: rotate(180deg);
- -o-transform: rotate(180deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
+ -webkit-transform: rotate(180deg) translate(-100%,-100%);
+ -moz-transform: rotate(180deg) translate(-100%,-100%);
+ -o-transform: rotate(180deg) translate(-100%,-100%);
+ rotation: 180deg translate(-100%,-100%);
}
.rot270 {
- rotation: 270deg;
- -webkit-transform: rotate(270deg);
- -moz-transform: rotate(270deg);
- -o-transform: rotate(270deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
+ -webkit-transform: rotate(270deg) translateX(-100%);
+ -moz-transform: rotate(270deg) translateX(-100%);
+ -o-transform: rotate(270deg) translateX(-100%);
+ rotation: 270deg translateX(-100%);
}
#message {
.fade {
opacity: 0;
- animation-duration: 2s;
- animation-name: fadeOut;
-webkit-animation-duration: 2s;
-webkit-animation-name: fadeOut;
+ animation-duration: 2s;
+ animation-name: fadeOut;
}
.fit_view {