Team:Paris Bettencourt/Overview/Results
From 2012.igem.org
(Difference between revisions)
Line 2: | Line 2: | ||
<!-- ########## Don't edit above ########## --> | <!-- ########## Don't edit above ########## --> | ||
<html> | <html> | ||
+ | <style type="text/css"> | ||
+ | |||
+ | .gallerycontainer{ | ||
+ | position: relative; | ||
+ | /*Add a height attribute and set to largest image's height to prevent overlaying*/ | ||
+ | } | ||
+ | |||
+ | .thumbnail img{ | ||
+ | border: 1px solid white; | ||
+ | margin: 0 5px 5px 0; | ||
+ | } | ||
+ | |||
+ | .thumbnail:hover{ | ||
+ | background-color: transparent; | ||
+ | } | ||
+ | |||
+ | .thumbnail:hover img{ | ||
+ | border: 1px solid blue; | ||
+ | } | ||
+ | |||
+ | .thumbnail span{ /*CSS for enlarged image*/ | ||
+ | position: absolute; | ||
+ | background-color: lightyellow; | ||
+ | padding: 5px; | ||
+ | left: -1000px; | ||
+ | border: 1px dashed gray; | ||
+ | visibility: hidden; | ||
+ | color: black; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | .thumbnail span img{ /*CSS for enlarged image*/ | ||
+ | border-width: 0; | ||
+ | padding: 2px; | ||
+ | } | ||
+ | |||
+ | .thumbnail:hover span{ /*CSS for enlarged image*/ | ||
+ | visibility: visible; | ||
+ | top: 0; | ||
+ | left: 230px; /*position where enlarged image should offset horizontally */ | ||
+ | z-index: 50; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
<div class="gallerycontainer"> | <div class="gallerycontainer"> |
Latest revision as of 12:48, 25 September 2012