Template:CAU China/Menu

From 2014.igem.org

(Difference between revisions)
 
(25 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
<style>
-
<html xmlns="http://www.w3.org/1999/xhtml">
+
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/
-
 
+
#globalWrapper, #content { /*-- changes default wiki settings --*/
-
<head>
+
width: 100%;  
-
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
+
height: 100%;
-
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
+
border: 0px;
-
<style type="text/css">
+
background-color: transparent;
-
<!--
+
margin: 0px;
-
 
+
padding: 0px;
-
 
+
}
-
div, ul, li, h3,p{ margin: 0px; padding: 0px; list-style: none; }
+
-
img{border:0 none;}
+
-
.box { width: 970px; margin:0 auto; clear:both;}
+
-
/*
+
-
------------------------------
+
-
CSS Common
+
-
------------------------------
+
-
*/
+
-
 
+
-
/* clearfixmenu */
+
html, body, .wrapper { /*-- changes default wiki settings --*/
-
.clearfixmenu:after {
+
width: 100%;  
-
content: ".";
+
height: 100%;  
-
display: block;
+
background-color: transparent;
-
clear: both;
+
-
visibility: hidden;
+
-
line-height: 0;
+
-
height: 0;
+
}
}
-
.clearfixmenu {
+
#top-section {
-
display: inline-block;
+
    background-color:#484848;
 +
    border: 0 none;
 +
    width: 100%;
 +
    height: 24px;
 +
    z-index: 100;
 +
    top: 0;
 +
    position: absolute;
}
}
-
html[xmlns] .clearfixmenu {
+
#menubar {
-
display: block;
+
    top: 2px;
 +
    font-family: Helvetica, Arial, Sans-serif;
 +
    font-size: 14px;
}
}
-
* html .clearfixmenu {
+
.left-menu,.left-menu a {
-
height: 1%;
+
    color: white;
 +
    left: 0;
 +
    text-align: left;
 +
    text-transform: capitalize;
}
}
-
/*
+
.right-menu,.right-menu a {
-
------------------------------
+
    color: white;
-
nav-menu  
+
    right: 0;
-
------------------------------
+
    text-align: right;
-
*/
+
-
+
-
/*主导航菜单*/
+
-
#nav-menu {
+
-
height: 35px;
+
-
background-image: url(menu/menubg1.gif);
+
-
background-repeat: no-repeat;
+
}
}
-
#nav-menucon {
+
.right-menu:hover, .left-menu:hover {
-
height: 36px;
+
    background-color: transparent;
-
background-image: url(menu/menubg1.gif);
+
-
background-repeat: no-repeat;
+
-
background-position: 0px -37px;
+
}
}
-
#nav-menucon .con{
+
.right-menu:hover a {
-
height: 36px;
+
    color: white;
-
line-height: 36px;
+
-
text-align: right;
+
-
padding-right: 10px;
+
}
}
-
#nav-menu .container {position: relative;overflow: visible; z-index: 99;}
+
.right-menu li a, .left-menu li a {
-
 
+
    background-color: transparent;
-
#nav-menu .menu {padding: 0 0 0 14px;}
+
    color: white;
-
#nav-menu .menu li {
+
    padding:0,15px,0,0;
-
position: relative;
+
    margin:0;
-
float: left;
+
-
padding: 0 8px 0 5px;
+
-
display: inline;
+
-
font-size: 14px;
+
-
background-position: right -622px;
+
}
}
-
#nav-menu .menu li h3 {font-weight: normal; display: inline-block; float: left;}
+
.right-menu li a:hover {
-
#nav-menu .menu li a.xialaguang {margin-top: 5px; display: inline-block; color: #FFF;text-decoration: none; font-size:14px;}
+
    color: white;
-
#nav-menu .menu li a.selected,
+
     text-decoration:underline;
-
#nav-menu .menu li a.navhover,
+
-
#nav-menu .menu li a.xialaguang:hover {color: #911531;  
+
-
     background-image: url(menu/menubg1.gif);
+
-
background-repeat: no-repeat;
+
-
background-position: left -83px;
+
}
}
-
#nav-menu .menu li a.navhover, #nav-menu .menu li a.xialaguang:hover {background-color: #FFF;}
+
.right-menu li a:visited {
-
#nav-menu .menu li a.xialaguang span {height: 30px; line-height: 25px; margin: 0 0 0 6px; padding: 0 6px 0 0; display: inline-block;font-weight:bold;}
+
    color: white;
-
#nav-menu .menu li a.selected span,
+
-
#nav-menu .menu li a.navhover span,
+
-
#nav-menu .menu li a.xialaguang:hover span {
+
-
cursor: pointer;
+
-
background-image: url(menu/menubg1.gif);
+
-
background-repeat: no-repeat;
+
-
background-position: right -83px;
+
}
}
-
#nav-menu .menu li a.navhover span, #nav-menu .menu li a.xialaguang:hover span {background-color: #FFF}
+
.new {
-
 
+
    color:white;
-
#nav-menu .menu li.overlay {
+
-
position: relative;
+
-
left: -4px;
+
-
width: 8px;
+
-
height: 28px;
+
-
padding: 0;
+
-
margin: 0;
+
-
background-image: url(menu/menubg1.gif);
+
-
background-position: center top;
+
}
}
-
 
+
a, a:visited {
-
#nav-menu .menu ul.children {
+
    color: white;
-
display: none;
+
    text-decoration: none;
-
position: absolute;
+
-
top: 35px;
+
-
left: 3px;
+
-
width: 225px;
+
-
padding: 5px 0 0 0;
+
-
background: #FFF;
+
-
border: 2px solid #d92640;
+
-
border-top: 0;
+
-
line-height: normal;
+
}
}
-
#nav-menu .menu ul.sleft {
+
a:hover {
-
left: auto;
+
    color: white;
-
right: 6px; _right: 5px;
+
    text-decoration: underline;
}
}
-
#nav-menu .menu ul.children li.noborder {border: none;}
+
</style>
-
#nav-menu .menu ul.children li {
+
<!-- STYLESHEET -->
-
float: left;
+
<!-- *********** -->
-
width: 110px;
+
-
padding: 1px;
+
-
display: inline-block;
+
-
background-image: none;
+
-
border-right: 1px solid #FFCFCF;
+
-
font-size: 12px;
+
-
}
+
-
#nav-menu .menu ul.children li h3 {display: block; width: 100%;}
+
-
#nav-menu .menu ul.children li a {
+
-
width: 100%;
+
-
height: 16px;
+
-
line-height: 17px;
+
-
overflow: hidden;
+
-
padding: 3px 0;
+
-
display: block;
+
-
color: #911531;
+
-
text-indent: 20px;
+
-
background-position: 8px -658px;text-decoration: none; font-size:12px;
+
-
}
+
-
#nav-menu .menu ul.children li a:hover {background-color: #FFE1E1;text-decoration: none;}
+
-
#nav-menu .menu ul.children li.count {clear: both;}
+
    <link rel="stylesheet" href="https://2011.igem.org/Team:DTU-Denmark/stylesheet?action=raw&ctype=text/css" type="text/css" />
-
#nav-menu .menu ul.children li.count div {width: 223px; margin: 5px 0 0; padding: 3px 0; background-color: #FFE1E1; color: #911531; text-indent: 8px;}
+
-
.stmenu {
+
<!-- JAVASCRIPTS -->
-
background-image: url(menu/stmenu.gif);
+
<!-- *********** -->
-
background-repeat: no-repeat;
+
-
background-position: left top;
+
-
}
+
-
-->
+
    <!-- ie9.js (fixes all Internet Explorer browsers older than ie9) -->
-
</style>
+
    <!--[if lt IE 9]>
-
</head>
+
    <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
 +
    <![endif]-->
-
<body>
+
    <!-- jQuery Tools (slider) -->
-
<div class="box">
+
    <script src="http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js"></script>
-
<div id="nav-menu">
+
    <script>
-
  <div class="container">
+
        $(function() {
-
    <div class="outerbox">
+
    // initialize scrollable
-
      <div class="innerbox clearfixmenu">
+
    $(".scrollable").scrollable().navigator();
 +
        });
 +
    </script>
-
<ul class="menu">
+
    <!-- Navigation scroll follow -->
 +
    <script type="text/javascript">
 +
        $(window).scroll(function () {
 +
            var scrollPos = $(window).scrollTop();
 +
            if (scrollPos > 110) {
 +
                $(".navigation").addClass("stickToTop");
 +
            } else {
 +
                $(".navigation").removeClass("stickToTop");
 +
            }
 +
            if (scrollPos > 180) {
 +
                $(".toc").addClass("stickBelowNavigation");
 +
            } else {
 +
                $(".toc").removeClass("stickBelowNavigation");
 +
            }
 +
        });
 +
    </script>
-
<li class="stmenu">
+
     <!-- MathJax (LaTeX for the web) -->
-
    <h3><a href="https://2014.igem.org/Team:CAU_China" class="xialaguang"><span>Home</span></a></h3></li>
+
     <script type="text/x-mathjax-config">
-
+
        MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
-
     <!--Team-->
+
        MathJax.Hub.Config({
-
     <li class="stmenu">
+
            TeX: {
-
    <h3><a href="https://2014.igem.org/Team:CAU_China/Team" class="xialaguang"><span>Team</span></a></h3>   
+
                equationNumbers: {  autoNumber: "AMS" }
-
    <ul style="display: none;" class="children clearfixmenu">   
+
            }
-
     <li><h3><a href="" class="stmenu"><span>Gallery</span></a></h3></li>
+
        });
-
     <li><h3><a href="" class="stmenu"><span>Attribution</span></a></h3></li>
+
     </script>
-
    <li class="count noborder"><div>Here we are!</div></li>
+
     <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
-
    </ul></li>
+
-
     <!--Project-->
+
     <!-- Sexy Drop Down (drop down navigation) -->
-
     <li class="stmenu">
+
     <script type="text/javascript">
-
    <h3><a href="https://2014.igem.org/Team:CAU_China/Project" class="xialaguang"><span>Project</span></a></h3>   
+
        $(document).ready(
-
    <ul style="display: none;" class="children clearfixmenu">   
+
            function(){
-
    <li><h3><a href="" class="stmenu"><span></span></a></h3></li>
+
                $("ul.subnav").parent().find("> a").append("<span> </span>");
-
    <li><h3><a href="" class="stmenu"><span></span></a></h3></li>
+
                $("ul.topnav li").hover(
-
    <li class="count noborder"><div>Our story!</div></li>
+
                    function() {
-
    </ul></li>
+
                        // Hover over
 +
                        $(this).parent().find("ul.subnav").hide();
 +
                        $(this).find("ul.subnav").show();
 +
                        // Hover out
 +
                        $(this).hover(
 +
                            function() {
 +
                            },
 +
                            function(){
 +
                                $(this).find("ul.subnav").hide();
 +
                            }
 +
                        );
 +
                    },
 +
                    function(){
 +
                        $(this).find("ul.subnav").hide();
 +
                    }
-
    <!--Modeling-->
+
                );
-
    <li class="stmenu">
+
            }
-
    <h3><a href="https://2014.igem.org/Team:CAU_China/Modeling" class="xialaguang"><span>Modeling</span></a></h3>   
+
        );
-
    <ul style="display: none;" class="children clearfixmenu">   
+
     </script>
-
     <li><h3><a href="" class="stmenu"><span></span></a></h3></li>
+
-
    <li class="count noborder"><div>Modeling it!</div></li>
+
-
    </ul></li>
+
-
    <!--Notebook-->
 
-
    <li class="stmenu">
 
-
    <h3><a href="https://2014.igem.org/Team:CAU_China/Notebook" class="xialaguang"><span>Notebook</span></a></h3>   
 
-
    <ul style="display: none;" class="children clearfixmenu">   
 
-
    <li><h3><a href="" class="stmenu"><span>Breakthrough</span></a></h3></li>
 
-
    <li><h3><a href="" class="stmenu"><span>Labnote</span></a></h3></li>
 
-
    <li class="count noborder"><div>Track us!</div></li>
 
-
    </ul></li>
 
-
    <!--Safety -->
+
-
     <li class="stmenu">
+
<div id="navigation">
-
    <h3><a href="https://2014.igem.org/Team:CAU_China/Safety" class="xialaguang"><span>Safety </span></a></h3>   
+
     <div class="navigation">
-
    <ul style="display: none;" class="children clearfixmenu">  
+
        <div class="centering">
-
    <li><h3><a href="" class="stmenu"><span></span></a></h3></li>
+
            <ul class="topnav" id="topnav">
-
    <li class="count noborder"><div>!!!</div></li>
+
                <li class="Home navitem1">
-
    </ul></li>
+
                    <a href="https://2014.igem.org/Team:CAU_China/Home">Home</a>
 +
                </li>
-
    <li class="overlay"></li></ul>
+
                <li class="Project navitem2">
 +
                    <a href="https://2014.igem.org/Team:CAU_China/Project" title="">Project</a>
 +
                    <ul class="subnav">
 +
                        <li><a href="https://2014.igem.org/Team:CAU_China/Project/Biobricks">Biobricks</a></li>
 +
                    </ul>
 +
                </li>
-
<script type="text/javascript">
+
                <li class="Modeling navitem3">
-
$('#nav-menu .menu > li').hover(function() {
+
                    <a href="https://2014.igem.org/Team:CAU_China/Modeling">Modeling</a>
-
$(this).find('.children').animate({ opacity:'show', height:'show' },300);
+
                </li>
-
$(this).find('.xialaguang').addClass('navhover');
+
 
-
}, function() {
+
                <li class="Notebook navitem4">
-
$('.children').stop(true,true).hide();
+
                    <a href="https://2014.igem.org/Team:CAU_China/Notebook">Notebook</a>
-
$('.xialaguang').removeClass('navhover');
+
                    <ul class="subnav">
-
}
+
                        <li><a href="">Labnote</a></li>
-
).slice(-3,-1).find('.children').addClass('sleft');
+
                        <li><a href="">Protocols</a></li>
-
</script>
+
                    </ul>
 +
                </li>
 +
 
 +
                <li class="Human_Practice navitem5">
 +
                    <a href="https://2014.igem.org/Team:CAU_China/Human_Practice">Human Practice</a>
 +
                    <ul class="subnav">
 +
                        <li><a href="https://2014.igem.org/Team:CAU_China/Human_Practice/Peers">Help Peers</a></li>
 +
                        <li><a href="https://2014.igem.org/Team:CAU_China/Human_Practice/Gene">iGEM-Help with Gene</a></li>
 +
                        <li><a href="https://2014.igem.org/Team:CAU_China/Human_Practice/Periodicals">Periodicals</a></li>
 +
                        <li><a href="https://2014.igem.org/Team:CAU_China/Human_Practice/Survey">Survey</a></li>
 +
                    </ul>
 +
                </li>
-
      </div>
+
                <li class="Judging navitem5">
-
    </div>
+
                    <a href="https://2014.igem.org/Team:CAU_China/Judging">Judging</a>
-
  </div>
+
                </li>
-
</div>
+
-
<div id="nav-menucon"><div class="con">test</div></div>
+
 +
                <li class="Team navitem7">
 +
                    <a href="https://2014.igem.org/Team:CAU_China/Team">Team</a>
 +
    <ul class="subnav">
 +
                        <li><a href="https://2014.igem.org/Team:CAU_China/Team/Gallery.html">Gallery</a></li>
 +
                        <li><a href="https://2014.igem.org/Team:CAU_China/Team/Attribution.html">Attributions</a></li>
 +
                    </ul>
 +
                </li>
 +
 +
        <li class="Safety navitem8">
 +
                    <a href="https://2014.igem.org/Team:CAU_China/Safety">Safety</a>
 +
                </li>
 +
 +
            </ul>
 +
        </div>
 +
    </div>
</div>
</div>
-
 
-
<tr>
 
-
<td colspan="5"></td>
 
-
<td align ="left"  width="162px"> <a href="https://2014.igem.org/Main_Page"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a> </td>
 
-
</tr>
 
-
</body>
 
</html>
</html>

Latest revision as of 03:58, 18 October 2014