Team:Sheffield/modelling
From 2014.igem.org
(Difference between revisions)
(Replaced content with "{{Team:Sheffield}}") |
|||
Line 1: | Line 1: | ||
{{Team:Sheffield}} | {{Team:Sheffield}} | ||
+ | <html xmlns="http://www.w3.org/1999/xhtml"> | ||
+ | <head> | ||
+ | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | ||
+ | <meta http-equiv="X-UA-Compatible" content="IE=edge" /> | ||
+ | <title>timeline</title> | ||
+ | |||
+ | <link href="css/style.css" rel="stylesheet" type="text/css" /> | ||
+ | |||
+ | </head> | ||
+ | <body> | ||
+ | |||
+ | <div class="content"> | ||
+ | <div class="wrapper"> | ||
+ | <div class="light"><i></i></div> | ||
+ | <hr class="line-left"> | ||
+ | <hr class="line-right"> | ||
+ | <div class="main"> | ||
+ | <h1 class="title">product</h1> | ||
+ | <div class="year"> | ||
+ | <h2><a href="#">2012<i></i></a></h2> | ||
+ | <div class="list"> | ||
+ | <ul> | ||
+ | <li class="cls highlight"> | ||
+ | <p class="date">March</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">April</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | |||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">May</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | |||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">June</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">July</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | |||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">August</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | |||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">September</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"></p> | ||
+ | </li> | ||
+ | <li class="cls highlight"> | ||
+ | <p class="date">October</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | </div> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="year"> | ||
+ | <h2><a href="#">2013<i></i></a></h2> | ||
+ | <div class="list"> | ||
+ | <ul> | ||
+ | <li class="cls"> | ||
+ | <p class="date">March</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | |||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">April</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | |||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">May</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">June</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls highlight"> | ||
+ | <p class="date">July</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | |||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls highlight"> | ||
+ | <p class="date">August</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">September</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | |||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">October</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | </div> | ||
+ | </li> | ||
+ | |||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="year"> | ||
+ | <h2><a href="#">2014<i></i></a></h2> | ||
+ | <div class="list"> | ||
+ | <ul> | ||
+ | <li class="cls"> | ||
+ | <p class="date">August</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | <div class="more"> | ||
+ | <p></p> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="cls"> | ||
+ | <p class="date">July</p> | ||
+ | <p class="intro"></p> | ||
+ | <p class="version"> </p> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <script type="text/javascript" src="js/jquery.min.js"></script> | ||
+ | <script type="text/javascript"> | ||
+ | $(".main .year .list").each(function(e, target){ | ||
+ | var $target= $(target), | ||
+ | $ul = $target.find("ul"); | ||
+ | $target.height($ul.outerHeight()), $ul.css("position", "absolute"); | ||
+ | }); | ||
+ | $(".main .year>h2>a").click(function(e){ | ||
+ | e.preventDefault(); | ||
+ | $(this).parents(".year").toggleClass("close"); | ||
+ | }); | ||
+ | </script> | ||
+ | |||
+ | </body> | ||
+ | </html> |
Revision as of 01:57, 12 September 2014