"
VirginiaTemplate3
From 2013.igem.org
(Difference between revisions)
| Line 239: | Line 239: | ||
color:#2B60DE; | color:#2B60DE; | ||
} | } | ||
| + | #images { | ||
| + | width: 900px; | ||
| + | height: 350px; | ||
| + | overflow: hidden; | ||
| + | position: relative; | ||
| + | margin: 20px auto; | ||
| + | } | ||
| + | #images img { | ||
| + | width: 900px; | ||
| + | height: 250px; | ||
| + | position: absolute; | ||
| + | top: 0; | ||
| + | left: -400px; | ||
| + | z-index: 2; | ||
| + | opacity: 0; | ||
| + | transition: all linear 500ms; | ||
| + | -o-transition: all linear 500ms; | ||
| + | -moz-transition: all linear 500ms; | ||
| + | -webkit-transition: all linear 500ms; | ||
| + | } | ||
| + | #images img:target { | ||
| + | left: 0; | ||
| + | z-index: 9; | ||
| + | opacity: 1; | ||
| + | } | ||
| + | #images img:first-child { | ||
| + | left: 0; | ||
| + | } | ||
| + | #slider a { | ||
| + | text-decoration: none; | ||
| + | background: #E3F1FA; | ||
| + | border: 1px solid #C6E4F2; | ||
| + | padding: 4px 6px; | ||
| + | color: #222; | ||
| + | width:200px; | ||
| + | margin-left:auto; | ||
| + | margin-right:auto; | ||
| + | } | ||
| + | #slider a:hover { | ||
| + | background: #C6E4F2; | ||
| + | } | ||
</style> | </style> | ||
| Line 291: | Line 332: | ||
<p><a href="">Collaboration</a></p></span></li></ul></div></div> | <p><a href="">Collaboration</a></p></span></li></ul></div></div> | ||
<div class="slidingpics"> | <div class="slidingpics"> | ||
| - | <div id="picbox"><img src="http://24.media.tumblr.com/97a47d3aa55da6f5985d81b4fd7dfb27/tumblr_mp2gt0CjGe1sxgpaeo1_1280.jpg" width="1000" height="350"/></div></div> | + | <div id="images"> |
| + | <img id="image1" src="http://24.media.tumblr.com/97a47d3aa55da6f5985d81b4fd7dfb27/tumblr_mp2gt0CjGe1sxgpaeo1_1280.jpg" /> | ||
| + | <img id="image2" src="http://24.media.tumblr.com/97a47d3aa55da6f5985d81b4fd7dfb27/tumblr_mp2gt0CjGe1sxgpaeo1_1280.jpg" /> | ||
| + | <img id="image3" src="http://24.media.tumblr.com/97a47d3aa55da6f5985d81b4fd7dfb27/tumblr_mp2gt0CjGe1sxgpaeo1_1280.jpg" /> | ||
| + | <img id="image4" src="http://24.media.tumblr.com/97a47d3aa55da6f5985d81b4fd7dfb27/tumblr_mp2gt0CjGe1sxgpaeo1_1280.jpg" /> | ||
| + | <img id="image5" src="http://24.media.tumblr.com/97a47d3aa55da6f5985d81b4fd7dfb27/tumblr_mp2gt0CjGe1sxgpaeo1_1280.jpg" /> | ||
| + | </div> | ||
| + | <div id="slider"> | ||
| + | <a href="#image1">1</a> | ||
| + | <a href="#image2">2</a> | ||
| + | <a href="#image3">3</a> | ||
| + | <a href="#image4">4</a> | ||
| + | <a href="#image5">5</a> | ||
| + | </div> | ||
| + | <!--<div id="picbox"><img src="http://24.media.tumblr.com/97a47d3aa55da6f5985d81b4fd7dfb27/tumblr_mp2gt0CjGe1sxgpaeo1_1280.jpg" width="1000" height="350"/></div>--> | ||
| + | </div> | ||
<div class="fourfocus"> | <div class="fourfocus"> | ||
<div id="boxes"><div id="fbox1"><a href=""><img src="http://24.media.tumblr.com/579c7d1022612a7d4824b443c7c85c0b/tumblr_mpqf8cpFsA1sxgpaeo2_250.jpg" width="235" height="235" alt="" /></a> | <div id="boxes"><div id="fbox1"><a href=""><img src="http://24.media.tumblr.com/579c7d1022612a7d4824b443c7c85c0b/tumblr_mpqf8cpFsA1sxgpaeo2_250.jpg" width="235" height="235" alt="" /></a> | ||
Revision as of 19:18, 17 July 2013
Project
Learn more about the exciting developments of minicells as a safe and effective chassis.
Notebook
See how we spent our summer of science.
Human Practices
Discover the local and global impact our iGEM team has made.
Team
Meet the brains and brawn behind the project.
SPONSORS BECAUSE WE NEED $$$$$
