Permalink
Browse files

画像マウスオーバー時のアニメーション追加

旧ブラウザ対応してないので必要なら方法変える
  • Loading branch information...
wacky committed May 24, 2013
1 parent d764675 commit 9b5a3ad4c22447711281c4222eb19ceaf44eb1cc
Showing with 28 additions and 0 deletions.
  1. +28 −0 app/assets/stylesheets/photos.css.scss
@@ -316,6 +316,34 @@ header {
}
}
+.imageBox {
+ figure {
+ display: block;
+ position: relative;
+ overflow: hidden;
+ }
+
+ figcaption {
+ position: absolute;
+ padding: 10px 20px;
+ top: 100%;
+ left: 0;
+ width: 100%;
+ height: 100%;
+
+ background: rgba(0,0,0,0.45);
+ color: white;
+
+ -webkit-transition: all 0.4s ease;
+ -moz-transition: all 0.4s ease;
+ -o-transition: all 0.4s ease;
+ }
+
+ figure:hover figcaption {
+ top: 0;
+ }
+}
+
/** Loader **/
#loader {

0 comments on commit 9b5a3ad

Please sign in to comment.