Template:Team:SCUT-China/mainpage
From 2014.igem.org
(Difference between revisions)
Yanzw scut (Talk | contribs) |
Yanzw scut (Talk | contribs) |
||
(20 intermediate revisions not shown) | |||
Line 3: | Line 3: | ||
<html> | <html> | ||
<head> | <head> | ||
+ | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script> | ||
+ | |||
<style type="text/css"> | <style type="text/css"> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
#navi | #navi | ||
{ | { | ||
- | width: | + | width:240px; |
float:left; | float:left; | ||
- | margin-left: | + | margin-left:60px; |
- | margin-top: | + | margin-top:50px; |
border-top:2px solid red; | border-top:2px solid red; | ||
border-bottom:4px solid red; | border-bottom:4px solid red; | ||
} | } | ||
- | # | + | #navislide |
{ | { | ||
background-color:transparent; | background-color:transparent; | ||
Line 48: | Line 42: | ||
padding:0px; | padding:0px; | ||
display:none; | display:none; | ||
- | |||
- | |||
} | } | ||
.navimenu_body a | .navimenu_body a | ||
Line 65: | Line 57: | ||
{ | { | ||
color:red; | color:red; | ||
+ | background-color:white; | ||
+ | opacity:0.7; | ||
} | } | ||
.navimenu_head a:hover | .navimenu_head a:hover | ||
Line 70: | Line 64: | ||
color:red; | color:red; | ||
} | } | ||
- | # | + | #show |
{ | { | ||
- | + | display:block; | |
- | + | ||
- | + | ||
- | + | ||
} | } | ||
+ | |||
+ | #whole{left:0px;top:0;width:100%;} | ||
+ | |||
+ | .bgdiv{margin-top:52px;margin-left:25%;padding-bottom:5px;width:65%;background-image:url('https://static.igem.org/mediawiki/2014/b/b5/Scut-china_2014_bgdiv-bg.png');"} | ||
+ | .logo{margin-left:4%;margin-top:20px;width:87px;height:100px;} | ||
</style> | </style> | ||
+ | |||
+ | |||
+ | |||
<script type="text/javascript"> | <script type="text/javascript"> | ||
- | $(document).ready(function() | + | $(document).ready(function(){ |
- | { | + | $(".navimenu_head").mouseover(function(){ |
- | $(" | + | $(this).next(".navimenu_body").slideDown("normal").siblings(".navimenu_body").slideUp("slow"); |
- | + | ||
- | $(this).next(" | + | |
}); | }); | ||
}) | }) | ||
</script> | </script> | ||
- | |||
- | |||
+ | <script type="text/javascript"> | ||
+ | $(document).ready(function(){ | ||
+ | var element = $("#navi"); | ||
+ | var top = element.position().top; | ||
+ | var pos = element.css("position"); | ||
+ | $(window).scroll(function(){ | ||
+ | var scrolls = $(this).scrollTop() + 30; | ||
+ | if (scrolls > top) | ||
+ | { | ||
+ | element.css({position:"fixed",top:30}); | ||
+ | } | ||
+ | else { | ||
+ | element.css({position:pos,top:top}); | ||
+ | } | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
+ | <script type="text/javascript"> | ||
+ | function scroll(element){ | ||
+ | var eletop = element.offset().top; | ||
+ | $('body,html').animate({scrollTop:eletop},600); | ||
+ | }; | ||
+ | function scroll_1(){ | ||
+ | var element = $("#label1"); | ||
+ | scroll(element); | ||
+ | }; | ||
+ | function scroll_2(){ | ||
+ | var element = $("#label2"); | ||
+ | scroll(element); | ||
+ | }; | ||
+ | function scroll_3(){ | ||
+ | var element = $("#label3"); | ||
+ | scroll(element); | ||
+ | }; | ||
+ | function scroll_4(){ | ||
+ | var element = $("#label4"); | ||
+ | scroll(element); | ||
+ | }; | ||
+ | </script> | ||
+ | </head> | ||
</html> | </html> |
Latest revision as of 03:04, 18 October 2014