Template:Team:Bielefeld-Germany/css/frontpage.css
From 2013.igem.org
(Difference between revisions)
m |
m |
||
Line 58: | Line 58: | ||
.view img { | .view img { | ||
- | transition: all 0. | + | transition: all 0.2s linear; |
} | } | ||
.view .mask { | .view .mask { | ||
- | background-color: rgba( | + | opacity: 0; |
- | + | background-color: rgba(219,127,8, 0.7); | |
- | + | ||
transition: all 0.4s ease-in-out; | transition: all 0.4s ease-in-out; | ||
} | } | ||
- | .view h2{ | + | .view h2 { |
- | + | transform: translateY(-100px); | |
- | + | opacity: 0; | |
- | + | transition: all 0.2s ease-in-out; | |
} | } | ||
- | .view p{ | + | .view p { |
+ | transform: translateY(100px); | ||
opacity: 0; | opacity: 0; | ||
- | |||
transition: all 0.2s linear; | transition: all 0.2s linear; | ||
} | } | ||
+ | .view a.info{ | ||
+ | opacity: 0; | ||
+ | transition: all 0.2s ease-in-out; | ||
+ | } | ||
+ | |||
+ | .view:hover img { | ||
+ | transform: scale(1.1); | ||
+ | } | ||
+ | .view:hover .mask { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | .view:hover h2, | ||
+ | .view:hover p, | ||
+ | .view:hover a.info { | ||
+ | opacity: 1; | ||
+ | transform: translateY(0px); | ||
+ | } | ||
+ | .view:hover p { | ||
+ | transition-delay: 0.1s; | ||
+ | } | ||
+ | .view:hover a.info { | ||
+ | transition-delay: 0.2s; | ||
+ | } | ||
+ | |||
+ | |||
</style> | </style> | ||
</html> | </html> |
Revision as of 17:10, 2 October 2013