Team:Shenzhen BGIC ATCG/temp/menu.html
From 2013.igem.org
(Difference between revisions)
Line 19: | Line 19: | ||
<script type="text/javascript" src="https://2012.igem.org/Team:Shenzhen/js/jquery.timers-1.2.js?action=raw&ctype=text/javascript"></script> | <script type="text/javascript" src="https://2012.igem.org/Team:Shenzhen/js/jquery.timers-1.2.js?action=raw&ctype=text/javascript"></script> | ||
<script type="text/javascript" src="https://2012.igem.org/Team:Shenzhen/js/jquery.easing.1.3.js?action=raw&ctype=text/javascript"></script> | <script type="text/javascript" src="https://2012.igem.org/Team:Shenzhen/js/jquery.easing.1.3.js?action=raw&ctype=text/javascript"></script> | ||
+ | <script type="text/javascript"> | ||
+ | $(function(){ | ||
+ | navpos(); | ||
+ | |||
+ | var board1_top = $("#board1").offset().top; | ||
+ | var board2_top = $("#board2").offset().top; | ||
+ | var board3_top = $("#board3").offset().top; | ||
+ | var board4_top = $("#board4").offset().top; | ||
+ | var board5_top = $("#board5").offset().top; | ||
+ | var board6_top = $("#board6").offset().top; | ||
+ | var board7_top = $("#board7").offset().top; | ||
+ | var board8_top = $("#board8").offset().top; | ||
+ | var board9_top = $("#board9").offset().top; | ||
+ | //alert(tops); | ||
+ | $(window).scroll(function(){ | ||
+ | var scroH = $(this).scrollTop(); | ||
+ | if(scroH>=board1_top){ | ||
+ | set_cur("#navleftsub1"); | ||
+ | }else if(scroH>=board2_top){ | ||
+ | set_cur("#navleftsub2"); | ||
+ | }else if(scroH>=board3_top){ | ||
+ | set_cur("#navleftsub3"); | ||
+ | }else if(scroH>=board4_top){ | ||
+ | set_cur("#navleftsub4"); | ||
+ | }else if(scroH>=board5_top){ | ||
+ | set_cur("#navleftsub5"); | ||
+ | }else if(scroH>=board6_top){ | ||
+ | set_cur("#navleftsub6"); | ||
+ | }else if(scroH>=board7_top){ | ||
+ | set_cur("#navleftsub7"); | ||
+ | }else if(scroH>=board8_top){ | ||
+ | set_cur("#navleftsub8"); | ||
+ | }else if(scroH>=board9_top){ | ||
+ | set_cur("#navleftsub9"); | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | $(".navleft li a").click(function() { | ||
+ | var el = $(this).attr('class'); | ||
+ | $('html, body').animate({ | ||
+ | scrollTop: $("#"+el).offset().top | ||
+ | }, 300); | ||
+ | $(this).addClass("cur").parent().siblings().find("a").removeClass("cur"); | ||
+ | }); | ||
+ | |||
+ | }); | ||
+ | $(window).resize(function(){ | ||
+ | navpos(); | ||
+ | }); | ||
+ | function navpos(){ | ||
+ | var offset = $("#content").offset().left; | ||
+ | var nav_w = $(".navleft").outerWidth(); | ||
+ | var left = offset-nav_w; | ||
+ | //alert(left); | ||
+ | if(left>10){ | ||
+ | $(".navleft").css("margin-left","-170px"); | ||
+ | }else{ | ||
+ | $(".navleft").css("margin-left",-(160+left)+"px"); | ||
+ | } | ||
+ | } | ||
+ | function set_cur(n){ | ||
+ | if($(".navleft a").hasClass("cur")){ | ||
+ | $(".navleft a").removeClass("cur"); | ||
+ | } | ||
+ | $(".navleft a"+n).addClass("cur"); | ||
+ | } | ||
+ | </script> | ||
<div class="menu"> | <div class="menu"> | ||
<ul class="menu_navi"> | <ul class="menu_navi"> |
Revision as of 15:54, 15 September 2013