|
|
(195 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
| |
- | <html>
| |
- | <head>
| |
- | <title>2012 iGEM KAIST</title>
| |
- | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
| |
- | <meta name="description" content="Awesome Bubble Navigation with jQuery" />
| |
- | <meta name="keywords" content="jquery, circular menu, navigation, round, bubble"/>
| |
- | <link rel="stylesheet" href="https://2012.igem.org/Team:KAIST_Korea/css" type="text/css" media="screen"/>
| |
| | | |
- |
| |
- |
| |
- | <style>
| |
- | *{
| |
- | font-size:16px;
| |
- | margin:0 auto;
| |
- | margin-bottom:0em;
| |
- | padding:0;
| |
- |
| |
- | }
| |
- | body{
| |
- |
| |
- |
| |
- | font-family:Arial;
| |
- | background:#fff url(https://static.igem.org/mediawiki/2012/thumb/3/3a/Bg.png/800px-Bg.png) no-repeat top left;
| |
- | }
| |
- | .title{
| |
- | width:34.25em;
| |
- | height:7.4375em;
| |
- | position:absolute;
| |
- | top:12.5em;
| |
- | left:10em;
| |
- | background:transparent url(images/etitle.png) no-repeat top left;
| |
- | }
| |
- | a.back{
| |
- | background:transparent url(images/iGEM.png) no-repeat top left;
| |
- | position:absolute;
| |
- | width:9.375em;
| |
- | height:6.25em;
| |
- | outline:none;
| |
- | top:41.25em;
| |
- | left:0em;
| |
- | }
| |
- | #content{
| |
- | margin:0 auto;
| |
- | }
| |
- |
| |
- |
| |
- | </style>
| |
- |
| |
- | </head>
| |
- |
| |
- | <body>
| |
- | <script type="text/javascript" src="jquery.js">
| |
- | $(document).ready(function(){
| |
- | $("top-section").hide();
| |
- | });
| |
- | <div id="content">
| |
- | <a class="back" href="https://igem.org/Main_Page"></a>
| |
- | <div class="title"></div>
| |
- |
| |
- | <div class="navigation" id="nav">
| |
- | <div class="item2 ehome">
| |
- | <a href="./menu_home.html" class="icon2"></a>
| |
- |
| |
- | </div>
| |
- | <div class="item eteam">
| |
- | <img src="images/bg_user.png" alt="" width="12.4375em" height="12.4375em" class="circle"/>
| |
- | <a href="#" class="icon"></a>
| |
- | <h2>Team</h2>
| |
- | <ul>
| |
- | <li><a href="./menu_team_profile.html">Team Profile</a></li>
| |
- | <li><a href="./menu_team_gallery.html">Gallery</a></li>
| |
- | </ul>
| |
- | </div>
| |
- | <div class="item epart">
| |
- | <img src="images/bg_shop.png" alt="" width="12.4375em" height="12.4375em" class="circle"/>
| |
- | <a href="#" class="icon"></a>
| |
- | <h2>Part</h2>
| |
- | <ul>
| |
- | <li><a href="./menu_part_biobrick.html">Bio Bricks</a></li>
| |
- | <li><a href="./menu_part_about.html">About Bricks</a></li>
| |
- | </ul>
| |
- | </div>
| |
- | <div class="item eproject">
| |
- | <img src="images/bg_home.png" alt="" width="12.4375em" height="12.4375em" class="circle"/>
| |
- | <a href="#" class="icon"></a>
| |
- | <h2>Project</h2>
| |
- | <ul>
| |
- | <li><a href="./menu_project_background.html">Background</a></li>
| |
- | <li><a href="./menu_project_expDesign.html">Exp Design</a></li>
| |
- | <li><a href="./menu_project_expResult.html">Results</a></li>
| |
- | <li><a href="./menu_project_future.html">Future Plan</a></li>
| |
- | </ul>
| |
- | </div>
| |
- |
| |
- | <div class="item emodeling">
| |
- | <img src="https://static.igem.org/mediawiki/2012/2/22/Bg_camera.png" alt="" width="12.4375em" height="12.4375em" class="circle"/>
| |
- | <a href="#" class="icon"></a>
| |
- | <h2>Modeling</h2>
| |
- | <ul>
| |
- | <li><a href="./menu_modeling_modeling1.html">Model1</a></li>
| |
- | <li><a href="./menu_modeling_modeling2.html">Model2</a></li>
| |
- | <li><a href="./menu_modeling_modeling3.html">Model3</a></li>
| |
- | </ul>
| |
- | </div>
| |
- | <div class="item enote">
| |
- | <img src="images/bg_fav.png" alt="" width="12.4375em" height="12.4375em" class="circle"/>
| |
- | <a href="#" class="icon"></a>
| |
- | <h2>Notebook</h2>
| |
- | <ul>
| |
- | <li><a href="./menu_notebook_protocol.html">Protocol</a></li>
| |
- | <li><a href="./menu_notebook_labnote.html">Labnote</a></li>
| |
- | <li><a href="./menu_notebook_result.html">Overview</a></li>
| |
- | </ul>
| |
- | </div>
| |
- | <div class="item esafety">
| |
- | <img src="images/bg_keys.png" alt="" width="12.4375em" height="12.4375em" class="circle"/>
| |
- | <a href="#" class="icon"></a>
| |
- | <h2>Safety</h2>
| |
- | <ul>
| |
- | <li><a href="./menu_safety_safety1.html">Safety1</a></li>
| |
- | <li><a href="./menu_safety_safety2.html">Safety2</a></li>
| |
- | </ul>
| |
- | </div>
| |
- | <div class="item eatt">
| |
- | <img src="https://static.igem.org/mediawiki/2012/5/5e/Bg_att.png" alt="" width="12.4375em" height="12.4375em" class="circle"/>
| |
- | <a href="#" class="icon"></a>
| |
- | <h2>Attribution</h2>
| |
- | <ul>
| |
- | <li><a href="./menu_attribution_attr1.html">Attr1</a></li>
| |
- | <li><a href="./menu_attribution_attr2.html">Attr2</a></li>
| |
- | </ul>
| |
- | </div>
| |
- |
| |
- |
| |
- | <div class="item face">
| |
- | <a href="http://www.facebook.com/pages/KAIST-iGEM-2012/450165755011680" class="icon"></a>
| |
- | </div>
| |
- |
| |
- | <div class="item twit">
| |
- | <a href="http://twitter.com/#!/KAIST_iGEM_2012" class="icon"></a>
| |
- | </div>
| |
- | <div class="item maill">
| |
- | <a href="#" class="icon"></a>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- | <!-- The JavaScript -->
| |
- | <script type="text/javascript" src="https://2012.igem.org/Team:KAIST_Korea/js"></script>
| |
- | <script type="text/javascript" src="https://2012.igem.org/Team:KAIST_Korea/js_easing"></script>
| |
- | <script type="text/javascript">
| |
- | $(function() {
| |
- | $('#nav > div').hover(
| |
- | function () {
| |
- | var $this = $(this);
| |
- | $this.find('img').stop().animate({
| |
- | 'width' :'12.4375em',
| |
- | 'height' :'12.4375em',
| |
- | 'top' :'-1.5625em',
| |
- | 'left' :'-1.5625em',
| |
- | 'opacity' :'1.0'
| |
- | },500,'easeOutBack',function(){
| |
- | $(this).parent().find('ul').fadeIn(700);
| |
- | });
| |
- |
| |
- | $this.find('a:first,h2').addClass('active');
| |
- | },
| |
- | function () {
| |
- | var $this = $(this);
| |
- | $this.find('ul').fadeOut(500);
| |
- | $this.find('img').stop().animate({
| |
- | 'width' :'3.25em',
| |
- | 'height' :'3.25em',
| |
- | 'top' :'0em',
| |
- | 'left' :'0em',
| |
- | 'opacity' :'0.1'
| |
- | },5000,'easeOutBack');
| |
- |
| |
- |
| |
- | $this.find('a:first,h2').removeClass('active');
| |
- |
| |
- | }
| |
- | );
| |
- |
| |
- |
| |
- | });
| |
- | </script>
| |
- |
| |
- | </body>
| |
- | </html>
| |