Add some fancy animations for tooltips

kpx · Nov 8, 2010 · effd99a · effd99a
1 parent 7e9ad65
commit effd99a
Showing 1 changed file with 12 additions and 3 deletions.
diff --git a/site/static/css/style.css b/site/static/css/style.css
@@ -136,18 +136,24 @@ a:hover, a:active {
 
 .wtt2 {
     display: inline;
+
 }
 
 .wtt2 div {
-    display: none;
+    position: absolute;
+    z-index: -1;
     font-size: 19px;
     border: 4px solid #ddd;
     -webkit-box-shadow: 8px 10px 10px rgba(0,0,0,0.5);
     -moz-box-shadow: 8px 10px 10px rgba(0,0,0,0.5);
     padding: 7px;
     border-radius: 10px;
     left: -17px;
-    bottom: 18px;
+    bottom: 25px;
+    background-color: white;
+    -webkit-transition: all 0.2s linear;
+    -moz-transition: all 0.2s linear;
+    opacity: 0;
 }
 
 .wtt2 h3 {
@@ -172,7 +178,10 @@ a:hover, a:active {
     z-index: 1;
     position:absolute;
     overflow: visible;
-    background-color: white;
+    bottom: 18px;
+    -webkit-transition: all 0.2s linear;
+    -moz-transition: all 0.2s linear;
+    opacity: 1;
 }
 
 .iwtt {