Add CSS transition on images (only for webkit for now)
authorBenoît Dien <benoit.dien@gmail.com>
Tue, 2 Nov 2010 14:59:03 +0000 (15:59 +0100)
committerGuillaume Cottenceau <gcottenc@gmail.com>
Thu, 4 Nov 2010 22:00:58 +0000 (23:00 +0100)
data/booh/themes/gradient/root/booh.css

index 9388ab4..634db55 100644 (file)
@@ -92,15 +92,17 @@ td {
 }
 
 .image img, .thumbnail_video img, .thumbnail_image img, .fullscreen_image img, .fullscreen_video img {
-     -moz-box-shadow:   0px 16px 60px rgba(0,0,0,0.25);
+       -moz-box-shadow: 0px 16px 60px rgba(0,0,0,0.25);
     -webkit-box-shadow: 0px 16px 60px rgba(0,0,0,0.25);
             box-shadow: 0px 16px 60px rgba(0,0,0,0.25);
+    -webkit-transition: -webkit-transform 0.25s linear; 
 }
 
 .image img:hover, .thumbnail_video img:hover, .thumbnail_image img:hover {
-     -moz-box-shadow:   0px 16px 60px rgba(0,0,0,0.35);
+       -moz-box-shadow: 0px 16px 60px rgba(0,0,0,0.35);
     -webkit-box-shadow: 0px 16px 60px rgba(0,0,0,0.35);
             box-shadow: 0px 16px 60px rgba(0,0,0,0.35);
+     -webkit-transform: rotate(-1deg) scale(1.05);
 }
 
 .disabled {
@@ -157,3 +159,4 @@ a.fullscreenvideolink {
        margin-left:auto;
        margin-right:auto;
 }
+