"
Team:UPenn/Project
From 2013.igem.org
(Difference between revisions)
m |
|||
| Line 1: | Line 1: | ||
| - | |||
| - | |||
| - | |||
| - | |||
<html> | <html> | ||
<head> | <head> | ||
<link href="https://googledrive.com/host/0B4ZBZOYYKBzEYUtsRS1ZWHM2bTQ" type="text/css" rel="stylesheet"/> | <link href="https://googledrive.com/host/0B4ZBZOYYKBzEYUtsRS1ZWHM2bTQ" type="text/css" rel="stylesheet"/> | ||
| + | |||
| + | |||
| + | <script> | ||
| + | //Script here going to make more bubbles appear when hovering over one. | ||
| + | </script> | ||
| + | <style> | ||
| + | |||
| + | .three { | ||
| + | background-image: url("https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/8XND1QonMj/Profile%20Photos/coolbluestuff.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg"); | ||
| + | position: relative; | ||
| + | text-align: center; | ||
| + | height:800px; | ||
| + | width: 100%; | ||
| + | background-color: rgb(200,200,200); | ||
| + | padding-top: 50px; | ||
| + | } | ||
| + | |||
| + | .bubble { | ||
| + | height: 200px; | ||
| + | width: 200px; | ||
| + | background-color: white; | ||
| + | margin-left: 100px; | ||
| + | margin-top: 50px; | ||
| + | -moz-border-radius: 100%; | ||
| + | -ms-border-radius: 100%; | ||
| + | -webkit-border-radius: 100%; | ||
| + | -o-border-radius: 100%; | ||
| + | border-radius: 100%; | ||
| + | opacity: 1; | ||
| + | text-align: center; | ||
| + | padding: 100px; | ||
| + | } | ||
| + | |||
| + | #second { | ||
| + | margin-left: 350px; | ||
| + | height: 100px; | ||
| + | width: 100px; | ||
| + | margin-top: -30px; | ||
| + | } | ||
| + | |||
| + | </style> | ||
</head> | </head> | ||
<body> | <body> | ||
| - | |||
<!--Navigation bar at the top--> | <!--Navigation bar at the top--> | ||
<ul class="nav"> | <ul class="nav"> | ||
| - | <li><a href="https://2013.igem.org/Team: | + | <li><a href="https://2013.igem.org/Team:Penn">Home</a></li> |
| - | <li id="team"><a href="https:// | + | <li id="team">Team</li> |
| - | + | <li><a href="https://igem.org/Team.cgi?year=2013&team_name=Penn">Official Team Profile</a></li> | |
| - | <li><a href="https://2013.igem.org/Team: | + | <li><a href="https://2013.igem.org/Team:Penn/Project">Project</a></li> |
| - | <li><a href="https://2013.igem.org/Team: | + | <li><a href="https://2013.igem.org/Team:Penn/Parts">Parts</a></li> |
| - | <li><a href="https://2013.igem.org/Team: | + | <li><a href="https://2013.igem.org/Team:Penn/Modeling">Modeling</a></li> |
| - | <li><a href="https://2013.igem.org/Team: | + | <li><a href="https://2013.igem.org/Team:Penn/Notebook">Notebook</a></li> |
| - | <li><a href="https://2013.igem.org/Team: | + | <li><a href="https://2013.igem.org/Team:Penn/Safety">Safety</a></li> |
</ul> | </ul> | ||
| - | + | ||
| + | |||
| + | <div class="three"> | ||
| + | <!--Experimenting with a way to present the project in an interesting way. | ||
| + | each "bubble" has some information about the project. Hovering over a bubble will | ||
| + | make another bubble appear with more information.--> | ||
| + | <div class="bubble" id="first"> | ||
| + | <h2>Project</h2> | ||
| + | </div> | ||
| + | |||
| + | <div class="bubble" id="second"> | ||
| + | </div> | ||
| + | </div> | ||
</body> | </body> | ||
</html> | </html> | ||
Revision as of 14:26, 5 July 2013
