Team:Arizona State/Template:Test
From 2012.igem.org
(Difference between revisions)
Line 1: | Line 1: | ||
<html> | <html> | ||
<head> | <head> | ||
+ | <style type="text/css"> | ||
+ | |||
+ | #container { | ||
+ | width: 1000px; | ||
+ | overflow: hidden; | ||
+ | margin: 50px auto; | ||
+ | background: white; | ||
+ | } | ||
+ | |||
+ | /*photobanner*/ | ||
+ | |||
+ | .photobanner { | ||
+ | height: 233px; | ||
+ | width: 3550px; | ||
+ | margin-bottom: 80px; | ||
+ | } | ||
+ | |||
+ | .photobanner img { | ||
+ | -webkit-transition: all 0.5s ease; | ||
+ | -moz-transition: all 0.5s ease; | ||
+ | -o-transition: all 0.5s ease; | ||
+ | -ms-transition: all 0.5s ease; | ||
+ | transition: all 0.5s ease; | ||
+ | } | ||
+ | |||
+ | .photobanner img:hover { | ||
+ | -webkit-transform: scale(1.1); | ||
+ | -moz-transform: scale(1.1); | ||
+ | -o-transform: scale(1.1); | ||
+ | -ms-transform: scale(1.1); | ||
+ | transform: scale(1.1); | ||
+ | cursor: pointer; | ||
+ | |||
+ | -webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0.2); | ||
+ | -moz-box-shadow: 0px 3px 5px rgba(0,0,0,0.2); | ||
+ | box-shadow: 0px 3px 5px rgba(0,0,0,0.2); | ||
+ | } | ||
+ | |||
+ | |||
+ | /*keyframe animations*/ | ||
+ | .first { | ||
+ | -webkit-animation: bannermove 30s linear infinite; | ||
+ | -moz-animation: bannermove 30s linear infinite; | ||
+ | -ms-animation: bannermove 30s linear infinite; | ||
+ | animation: bannermove 30s linear infinite; | ||
+ | } | ||
+ | |||
+ | @keyframes "bannermove" { | ||
+ | 0% { | ||
+ | margin-left: 0px; | ||
+ | } | ||
+ | 100% { | ||
+ | margin-left: -2125px; | ||
+ | } | ||
+ | |||
+ | } | ||
+ | |||
+ | @-moz-keyframes bannermove { | ||
+ | 0% { | ||
+ | margin-left: 0px; | ||
+ | } | ||
+ | 100% { | ||
+ | margin-left: -2125px; | ||
+ | } | ||
+ | |||
+ | } | ||
+ | |||
+ | @-webkit-keyframes "bannermove" { | ||
+ | 0% { | ||
+ | margin-left: 0px; | ||
+ | } | ||
+ | 100% { | ||
+ | margin-left: -2125px; | ||
+ | } | ||
+ | |||
+ | } | ||
+ | |||
+ | @-ms-keyframes "bannermove" { | ||
+ | 0% { | ||
+ | margin-left: 0px; | ||
+ | } | ||
+ | 100% { | ||
+ | margin-left: -2125px; | ||
+ | } | ||
+ | |||
+ | } | ||
+ | |||
+ | @-o-keyframes "bannermove" { | ||
+ | 0% { | ||
+ | margin-left: 0px; | ||
+ | } | ||
+ | 100% { | ||
+ | margin-left: -2125px; | ||
+ | } | ||
+ | |||
+ | } | ||
+ | </style> | ||
</head> | </head> | ||
Line 6: | Line 103: | ||
<body> | <body> | ||
- | <div style="width: 900px; border: solid 1px #C0C0C0; background: #FFFFFF; padding: 0px; color: #000000; font-size: 12px"> | + | <div id="container" style="width: 900px; height:510px; border: solid 1px #C0C0C0; background: #FFFFFF; padding: 0px; color: #000000; font-size: 12px"> |
- | + | <div class="photobanner"> | |
- | + | ||
- | + | ||
<a href=""> | <a href=""> | ||
- | <img src="https://static.igem.org/mediawiki/2012/3/3e/Blue_Water-_Main_Image_copy.png" width="680" /> | + | <img class="first" src="https://static.igem.org/mediawiki/2012/3/3e/Blue_Water-_Main_Image_copy.png" width="680" /> |
</a> | </a> | ||
- | |||
- | |||
<a href=""> | <a href=""> | ||
<img src="https://static.igem.org/mediawiki/2012/9/9c/Regional_Photo.jpg" width="680" /> | <img src="https://static.igem.org/mediawiki/2012/9/9c/Regional_Photo.jpg" width="680" /> | ||
</a> | </a> | ||
- | |||
- | |||
<a href=""> | <a href=""> | ||
<img src="https://static.igem.org/mediawiki/2012/3/3f/Production_Pipeline.png" width="680" /> | <img src="https://static.igem.org/mediawiki/2012/3/3f/Production_Pipeline.png" width="680" /> | ||
</a> | </a> | ||
- | + | </div></div> | |
- | + | ||
- | + | ||
- | </div> | + | |
</body> | </body> | ||
</html> | </html> |
Revision as of 06:04, 24 October 2012