Template:Team:USTC-Software/header-n

From 2012.igem.org

(Difference between revisions)
(Created page with "{{Team:USTC-Software/hidden}} <html> <head> <title>home</title> <style> body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquo...")
 
(19 intermediate revisions not shown)
Line 3: Line 3:
<html>
<html>
<head>
<head>
-
<title>home</title>
+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 +
 
 +
 
 +
<!–[if IE 6]> 
 +
<script type="text/javascript"> 
 +
document.execCommand("BackgroundImageCache", false, true); 
 +
</script> 
 +
<![endif]–> 
 +
 
 +
 
 +
 
 +
<!–[if IE 6]> 
 +
<script type=text/javascript>       
 +
try {       
 +
document.execCommand("BackgroundImageCache", false, true);       
 +
}
 +
catch(err) {}       
 +
</script> 
 +
<![endif]–>
 +
 
            
            
   <style>
   <style>
-
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
+
 
-
margin:0;
+
-
padding:0;
+
-
}
+
-
html,body {
+
-
margin:0;
+
-
padding:0;
+
-
}
+
-
table {
+
-
border-collapse:collapse;
+
-
border-spacing:0;
+
-
}
+
-
fieldset,img {
+
-
border:0;
+
-
}
+
-
address,caption,cite,code,dfn,th,var {
+
-
font-style:normal;
+
-
font-weight:normal;
+
-
}
+
ol,ul {
ol,ul {
list-style:none;
list-style:none;
Line 57: Line 58:
clear: both;
clear: both;
}
}
 +
 +
*{
 +
margin: 0;
 +
padding: 0;
 +
text-decoration: none;
 +
}
 +
 +
a {outline: none;} /*for IE image-border and link dashed line bug*/
 +
a:focus { outline: 0; }
 +
a:active {star:expression_r(this.onFocus=this.blur());}
 +
:focus { outline:0; }
 +
img{display: block;border: none;}
 +
 +
 +
 +
 +
/*the begin of to top css*/
 +
  #topBar {
 +
      position: fixed;
 +
      right: 65px;
 +
      bottom:32px;
 +
      z-index: 20;
 +
    }
 +
  #topBar div {
 +
      background: url('https://static.igem.org/mediawiki/2012/4/4d/Top-black-arrow.png');
 +
      display: block;
 +
      height: 53px;
 +
  width: 53px;
 +
      overflow: hidden;
 +
      text-indent: -9999px;
 +
      cursor: pointer;
 +
      -webkit-transition: all 0.5s ease .03s;
 +
      -moz-transition: all 0.5s ease .03s;
 +
      -o-transition: all 0.5s ease .03s;
 +
      transition: all 0.5s ease .03s;
 +
    }
 +
    #topBar div:hover {
 +
background: url('https://static.igem.org/mediawiki/2012/f/f8/Gray-top-arrow.png');
 +
        -moz-transform: scale(1.05);
 +
        -webkit-transform:  scale(1.05);
 +
        -o-transform:scale(1.05);
 +
        transform:scale(1.05);
 +
    }/**************************the end of to top css*************/    
 +
 +
 +
 +
Line 64: Line 112:
}
}
 +
/*the begin of header-n css*/
-
#navs div{
+
#wrap-global_header-n{
-
float:left;
+
-
display:block;
+
-
}
+
-
 
+
-
#global_header{
+
width:980px;
width:980px;
height:130px;
height:130px;
position:relative;
position:relative;
-
margin:20px auto;
+
margin:30px auto;
float:none;
float:none;
}
}
-
#navs div{
 
-
margin-right:40px;
 
-
}
 
-
#team_logo{
+
#team_logo-n{
width:442px;
width:442px;
height:78px;
height:78px;
Line 91: Line 132:
}
}
-
#home_botton{
+
#wrap-global_header-n.home_botton{
width:127px;
width:127px;
height:35px;
height:35px;
background:url("https://static.igem.org/mediawiki/igem.org/e/ec/Home_normal.png");
background:url("https://static.igem.org/mediawiki/igem.org/e/ec/Home_normal.png");
background-position:center;
background-position:center;
 +
margin-right:40px;
 +
float:left;
}
}
-
#home_botton:active{
+
#wrap-global_header-n.home_botton:active{
background:url("https://static.igem.org/mediawiki/igem.org/d/da/Home_active.png");
background:url("https://static.igem.org/mediawiki/igem.org/d/da/Home_active.png");
background-position:center;
background-position:center;
 +
margin-right:40px;
 +
float:left;
}
}
-
#project_botton{
+
#wrap-global_header-n.project_botton{
width:80px;
width:80px;
Line 108: Line 153:
background:url("https://static.igem.org/mediawiki/igem.org/9/93/Project_normal.png");
background:url("https://static.igem.org/mediawiki/igem.org/9/93/Project_normal.png");
background-position:center;
background-position:center;
 +
margin-right:35px;
 +
float:left;
}
}
-
#project_botton:active{
+
#wrap-global_header-n.project_botton:active{
background:url("https://static.igem.org/mediawiki/igem.org/8/8b/Project_active.png");
background:url("https://static.igem.org/mediawiki/igem.org/8/8b/Project_active.png");
background-position:center;
background-position:center;
 +
margin-right:35px;
 +
    float:left;
}
}
-
#team_botton{
+
#wrap-global_header-n.team_botton{
width:118px;
width:118px;
height:35px;
height:35px;
Line 120: Line 169:
background-position:center;
background-position:center;
position:relative;
position:relative;
-
top:-2px !important; /* because the photo has some problem */
+
top:-2px ; /* because the photo has some problem */
 +
margin-right:45px;
 +
float:left;
}
}
-
#team_botton:active{
+
#wrap-global_header-n.team_botton:active{
background:url("https://static.igem.org/mediawiki/igem.org/a/a8/Team_active.png");
background:url("https://static.igem.org/mediawiki/igem.org/a/a8/Team_active.png");
background-position:center;
background-position:center;
 +
margin-right:45px;
 +
float:left;
}
}
-
#notes_botton{
+
#wrap-global_header-n.notes_botton{
width:118px;
width:118px;
height:35px;
height:35px;
background:url("https://static.igem.org/mediawiki/igem.org/c/ce/Notes_normal.png");
background:url("https://static.igem.org/mediawiki/igem.org/c/ce/Notes_normal.png");
background-position:center;
background-position:center;
 +
margin-right:40px;
 +
float:left;
}
}
-
#notes_botton:active{
+
#wrap-global_header-n.notes_botton:active{
background:url("https://static.igem.org/mediawiki/igem.org/e/ef/Notes_active.png");
background:url("https://static.igem.org/mediawiki/igem.org/e/ef/Notes_active.png");
background-position:center;
background-position:center;
 +
margin-right:40px;
 +
float:left;
}
}
-
#hp_botton{
+
#wrap-global_header-n.hp_botton{
width:174px;
width:174px;
height:35px;
height:35px;
background:url("https://static.igem.org/mediawiki/igem.org/5/55/Hp_normal.png");
background:url("https://static.igem.org/mediawiki/igem.org/5/55/Hp_normal.png");
background-position:center;
background-position:center;
 +
margin-right:40px;
 +
float:left;
}
}
-
#hp_botton:active{
+
#wrap-global_header-n.hp_botton:active{
background:url("https://static.igem.org/mediawiki/igem.org/1/1a/Hp_active.png");
background:url("https://static.igem.org/mediawiki/igem.org/1/1a/Hp_active.png");
background-position:center;
background-position:center;
-
}
+
margin-right:40px;
 +
float:left;
 +
} /*the end of header-n css*/
 +
</style>
</style>
          
          
Line 156: Line 218:
#search-control-box {
#search-control-box {
position: absolute;
position: absolute;
-
top: 87px;
+
top: 120px;
-
right: 8px;
+
right: 12px;
width: 158px;
width: 158px;
height: 45px;
height: 45px;
Line 197: Line 259:
</style>
</style>
-
</head>
+
 
 +
 
 +
 
 +
</head>
 +
 
<body>
<body>
-
<div id="global_header">
 
-
<div id="team_logo"></div>
 
-
 
-
    <div id="navs">
 
-
                              <ul>
 
-
<li><a href="#"/><div id="home_botton"></div></li>
 
-
<a href="#"/><div id="project_botton"></div>
 
-
<a href="#"/><div id="team_botton"></div>
+
 +
  <div id="wrap-global_header-n">
 +
  <div id="team_logo-n"></div>
 +
 +
        <a href="#"/><div id="wrap-global_header-n" class="home_botton"></div>
-
<a href="#"/><div id="notes_botton"></div>
+
<a href="#"/><div id="wrap-global_header-n" class="project_botton"></div>
-
<a href="#"/><div id="hp_botton"></div>
+
<a href="#"/><div id="wrap-global_header-n" class="team_botton"></div>
-
                              </ul>
+
 
-
    </div>
+
<a href="#"/><div id="wrap-global_header-n" class="notes_botton"></div>
-
     
+
 
-
             
+
<a href="#"/><div id="wrap-global_header-n" class="hp_botton"></div>
 +
 +
 +
       
               <!-- the begin of search box controls -->
               <!-- the begin of search box controls -->
<div id="search-control-box">
<div id="search-control-box">
Line 223: Line 289:
<input type="submit" name="fulltext" class="search_button" id="mw-search_button" value="Search" title="Search the pages for this text" x-webkit-speech="">
<input type="submit" name="fulltext" class="search_button" id="mw-search_button" value="Search" title="Search the pages for this text" x-webkit-speech="">
  </form>
  </form>
-
    </div> <!-- the end of search box controls -->
+
          </div> <!-- the end of search box controls -->
              
              
-
</div>
+
      </div><!-- the end of globle-headeer controls -->
-
          
+
 
-
</body>
+
 
 +
<div class="clr"></div>
 +
 
 +
  <!-----the begin of go to top div --->
 +
      <div class="clr"></div>
 +
  <div id="topBar">
 +
      <div id="goToTop" class="goToTop">TOP</div>
 +
  </div><!-----the begin of go to top div---->
 +
   
 +
  <script type="text/javascript">
 +
    (function(){
 +
      var special = jQuery.event.special,
 +
          uid1 = 'D' + (+new Date()),
 +
          uid2 = 'D' + (+new Date() + 1);
 +
     
 +
      special.scrollstart = {
 +
         setup: function(){
 +
          var timer,
 +
              handler = function(evt) {
 +
                var _self = this,
 +
                    _args = arguments;
 +
               
 +
                if(timer) {
 +
                  clearTimeout(timer);
 +
                } else {
 +
                  evt.type = 'scrollstart';
 +
                  jQuery.event.handle.apply(_self,_args);
 +
                }
 +
               
 +
                timer = setTimeout(function(){
 +
                  timer = null;
 +
                },special.scrollstop.latency);
 +
              };
 +
          jQuery(this).bind('scroll',handler).data(uid1,handler);   
 +
        },
 +
        teardown: function(){
 +
          jQuery(this).unbind('scroll',jQuery(this).data(uid1));
 +
        }
 +
      };
 +
     
 +
      special.scrollstop = {
 +
        latency: 300,
 +
        setup: function(){
 +
          var timer,
 +
              handler = function(evt) {
 +
                var _self = this,
 +
                    _args = arguments;
 +
               
 +
                if(timer) {
 +
                  clearTimeout(timer);
 +
                }
 +
               
 +
                timer = setTimeout(function(){
 +
                  timer = null;
 +
                  evt.type = 'scrollstop';
 +
                  jQuery.event.handle.apply(_self,_args);
 +
                },special.scrollstop.latency);
 +
              };
 +
          jQuery(this).bind('scroll',handler).data(uid2,handler);   
 +
        },
 +
        teardown: function() {
 +
          jQuery(this).unbind('scroll',jQuery(this).data(uid2));
 +
        }
 +
      };
 +
    })();
 +
  </script>
 +
  <script type="text/javascript">
 +
    $(function(){
 +
      //the element inside of which we want to scroll
 +
      var btns = $("#topBar div");
 +
      //show the buttons
 +
      btns.fadeIn("slow");
 +
      //whenever we scroll fade out both buttons
 +
      $(window).bind("scrollstart",function(){
 +
        btns.stop().animate({"opacity":"0.2"});
 +
      });
 +
      //...and whenever we stop scrolling fade in both buttons
 +
      $(window).bind("scrollstop",function(){
 +
        btns.stop().animate({"opacity":"1"});
 +
      });
 +
      //clicking the "goToTop" button will make the page scroll to the top of the page
 +
      $("#goToTop").click(function(e){
 +
        $("html,body").animate({scrollTop:"0px"},800);
 +
      });
 +
    });
 +
  </script><!-----the rnd of go to top js---->
 +
 
 +
 
 +
 
 +
 
 +
 
 +
  </body>
</html>
</html>

Latest revision as of 14:46, 23 September 2012

TOP

Retrieved from "http://2012.igem.org/Template:Team:USTC-Software/header-n"