Template:Queens Canada/Header

From 2012.igem.org

(Difference between revisions)
Line 13: Line 13:
     background-color: transparent;
     background-color: transparent;
     font-family: Tahoma, Geneva, sans-serif;
     font-family: Tahoma, Geneva, sans-serif;
-
     z-index: 5;
+
     z-index: 1;
}
}
#nav {
#nav {
Line 19: Line 19:
     clear: both;
     clear: both;
     font-size: 12px;
     font-size: 12px;
-
     height: 60px;
+
     height: 58px;
     padding: 0 0 0 0px;
     padding: 0 0 0 0px;
     position: relative;
     position: relative;
-
     width: 600px;
+
     width: 570px;
-
     left: 350px;
+
     left: 430px;
-
     top: -100px;
+
     top: 92px;
}
}
#nav ul {
#nav ul {
Line 151: Line 151:
#globalWrapper
#globalWrapper
{
{
-
width: 100%;
 
}
}
#top-section { height: 20px; margin-left: -487.5px; margin-bottom: 5; !important;
#top-section { height: 20px; margin-left: -487.5px; margin-bottom: 5; !important;
Line 179: Line 178:
     border-right: none;
     border-right: none;
background-color: transparent;
background-color: transparent;
-
width:100%
 
}
}
Line 537: Line 535:
     text-decoration:none;
     text-decoration:none;
     text-align:center;
     text-align:center;
 +
    padding-top:80px;
 +
    margin-top: -60px;
     cursor:pointer;
     cursor:pointer;
     postion: relative;
     postion: relative;
Line 583: Line 583:
top: 53px;
top: 53px;
left: 430px;  
left: 430px;  
-
}
 
-
#topbarcontainer
 
-
{
 
-
background-image: url('http://2012.igem.org/wiki/images/d/db/Topbar1.png');
 
-
background-repeat: repeat-x;
 
-
width: 100%;
 
-
height: 60px;
 
-
position: absolute;
 
-
top: 0px;
 
-
left: 0px;
 
-
-moz-box-shadow: 2px 2px 2px 2px #000;
 
-
-webkit-box-shadow: 2px 2px 2px 2px #000;
 
-
box-shadow: 2px 2px 2px 2px #000;
 
-
/* For IE 8 */
 
-
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=90, Color='#000000')";
 
-
/* For IE 5.5 - 7 */
 
-
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=90, Color='#000000');
 
-
}
 
-
#topbar
 
-
{
 
-
margin-left: auto;
 
-
margin-right: auto;
 
-
height: 60px;
 
-
position:relative;
 
-
width: 1000px;
 
}
}
Line 613: Line 588:
</head>
</head>
<body>
<body>
-
<div id="topbarcontainer">
+
<div id="headercontainer">
-
<div id="topbar">
+
<div id="header">
-
<a href="2012.igem.org/Team:Queens_Canada">
+
-
<img src="http://2012.igem.org/wiki/images/9/96/Headerv2.png">
+
-
</a>
+
-
 
+
<a id="qboxlink" href="http://www.queensu.ca/"></a>
<a id="qboxlink" href="http://www.queensu.ca/"></a>
<a id="iboxlink" href="http://2012.igem.org/Main_Page"></a>
<a id="iboxlink" href="http://2012.igem.org/Main_Page"></a>
-
 
<ul id="nav">
<ul id="nav">
<li id="test1"><a href="http://2012.igem.org/Team:Queens_Canada">Home</a></li>
<li id="test1"><a href="http://2012.igem.org/Team:Queens_Canada">Home</a></li>
Line 630: Line 600:
<li><a href="#">Ligation Method</a></li>
<li><a href="#">Ligation Method</a></li>
</ul>
</ul>
-
<li><a class="hsubs" href="#">Human Practices</a>
+
<li><a class="hsubs" href="#">Human <br> Practices</a>
</li>
</li>
<li><a href="http://2012.igem.org/Team:Queens_Canada/SynthetiQ">SynthetiQ</a>
<li><a href="http://2012.igem.org/Team:Queens_Canada/SynthetiQ">SynthetiQ</a>
Line 641: Line 611:
<div id="lavalamp"></div>
<div id="lavalamp"></div>
</ul>
</ul>
 +
 +
<div id="menu1">
 +
fas
</div>
</div>
</div>
</div>
 +
<div id="submenu_container">
 +
        <ul id="submenu">
 +
            <li class="home" style="width: 75px; left: 15px;"><a title="Home"></a></li>
 +
            <li class="about" style="width: 79px; left: 75px;"><a title="About"></a></li>
 +
            <li class="search" style="width: 94px; left: 79px;"><a title="Search"></a></li>
 +
            <li class="photos" style="width: 130px; left: 94px;"><a title="Photos"></a></li>
 +
            <li class="contact" style="width: 95px; left: 130px;"><a title="Contact"></a></li>
 +
        </ul>
 +
</div>
 +
</div>
 +
<script type="text/javascript">
 +
$("#test1").hover(function(){
 +
    $("#menu1").animate({ height: "100px" });
 +
}, function() {
 +
    $("#menu1").animate({ height: "0px" });
 +
});
 +
</script>
 +
<script type="text/javascript">
 +
            $(function() {
 +
                var d=300;
 +
                $('#submenu a').each(function(){
 +
                    var $this = $(this);
 +
var r=Math.floor(Math.random()*20)-10;
 +
                    $this.css({'-moz-transform':'rotate('+r+'deg)','-webkit-transform':'rotate('+r+'deg)','transform':'rotate('+r+'deg)'});
 +
                    $this.stop().animate({
 +
                        'marginTop':'-90px'                     
 +
                    },d+=150);
 +
                });
 +
                $('#submenu > li').hover(
 +
function () {
 +
var $this = $(this);
 +
$('a',$this).stop().animate({
 +
'marginTop':'-40px'
 +
},200);
 +
},
 +
function () {
 +
var $this = $(this);
 +
$('a',$this).stop().animate({
 +
'marginTop':'-90px'
 +
},200);
 +
}
 +
)
 +
            });
 +
        </script>
<a href="#top-section">
<a href="#top-section">

Revision as of 19:51, 22 June 2012

up
Control