- -webkit-transition : 0.5s ease-in-out; /* win safari3.2 */\r
- -webkit-transition : -webkit-transform 0.5s ease-in-out; /* win safari4 delay は指定しない */\r
- -moz-transition : -moz-transform 0.5s ease-in-out 0s;\r
- -ms-transition : -ms-transform 0.5s ease-in-out 0s;\r
- -o-transition : -o-transform 0.5s ease-in-out 0s;\r
- transition : transform 0.5s ease-in-out 0s;\r
-\r
- /* http://blog.webcreativepark.net/2012/10/19-161432.html */\r
- -webkit-backface-visibility : hidden;\r
- -moz-backface-visibility : hidden;\r
- backface-visibility : hidden;\r
-}\r
-.slidein .slider {\r
- -webkit-transform : translate(100px,0); /* win safari3.2 */\r
- -webkit-transform : translateX(100px) translateZ(0); /* safari4 */\r
- -moz-transform : translateX(100px) translateZ(0);\r
- -ms-transform : translateX(100px) translateZ(0);\r
- -o-transform : translateX(100px) translateZ(0);\r
- transform : translateX(100px) translateZ(0);\r
-}\r
-.slideout .slider {\r
- -webkit-transform : translate(0,0); /* win safari3.2 */\r
- -webkit-transform : translateX(0) translateZ(0); /* safari4 */\r
- -moz-transform : translateX(0) translateZ(0);\r
- -ms-transform : translateX(0) translateZ(0);\r
- -o-transform : translateX(0) translateZ(0);\r
- transform : translateX(0) translateZ(0);\r
-}\r
-.slider {\r
- position : absolute;\r
- top : 0;\r
- height : 0;\r
-}\r
-.slider div {\r
- position : absolute;\r
- top : 0;\r
- width : 200px;\r
- height : 200px;\r
-}\r
-.slider-red {\r
- left : 0;\r
- background : #f00;\r
-}\r
-.slider-blue {\r
- left : 200;\r
- background : #00f;\r
-}\r
-\r