X-Git-Url: http://git.scottworley.com/picsort/blobdiff_plain/eaa5e016a41682c1ccd99023bd346e0448fa0ca3..f5b65ffb443e01733be30d109122b9188d3d04fa:/picsorter.css?ds=inline diff --git a/picsorter.css b/picsorter.css index 712494b..bad3b89 100644 --- a/picsorter.css +++ b/picsorter.css @@ -7,26 +7,32 @@ 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 { @@ -64,10 +70,10 @@ .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 {