Team:NCTU Formosa/source/head
From 2013.igem.org
(Difference between revisions)
(153 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
<meta name="copyright" content="Contents belong to NCTU Formosa; Website designed by Calvin Hue." /> | <meta name="copyright" content="Contents belong to NCTU Formosa; Website designed by Calvin Hue." /> | ||
- | |||
<meta name="keywords" content="iGEM, NCTU_Formosa, NCTU, Formosa" /> | <meta name="keywords" content="iGEM, NCTU_Formosa, NCTU, Formosa" /> | ||
<link href="http://fonts.googleapis.com/css?family=Open+Sans:500,400,300|Lobster+Two:700|Quicksand:700" rel="stylesheet" type="text/css"> | <link href="http://fonts.googleapis.com/css?family=Open+Sans:500,400,300|Lobster+Two:700|Quicksand:700" rel="stylesheet" type="text/css"> | ||
+ | <link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.0/css/font-awesome.css" rel="stylesheet"> | ||
+ | <link href="http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet"> | ||
<link href='https://2013.igem.org/Team:NCTU Formosa/css/reset?action=raw&ctype=text/css' rel="stylesheet"> | <link href='https://2013.igem.org/Team:NCTU Formosa/css/reset?action=raw&ctype=text/css' rel="stylesheet"> | ||
<link href='https://2013.igem.org/Team:NCTU Formosa/css/style?action=raw&ctype=text/css' rel="stylesheet"> | <link href='https://2013.igem.org/Team:NCTU Formosa/css/style?action=raw&ctype=text/css' rel="stylesheet"> | ||
- | < | + | <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/> |
+ | <link rel="stylesheet" media="only screen and (min-width: 750px)" href="https://2013.igem.org/Team:NCTU Formosa/css/style850u?action=raw&ctype=text/css"> | ||
+ | <link rel="stylesheet" media="only screen and (max-width: 750px)" href="https://2013.igem.org/Team:NCTU Formosa/css/style850b?action=raw&ctype=text/css"> | ||
+ | <link rel="stylesheet" media="only screen and (max-width: 850px)" href="https://2013.igem.org/Team:NCTU Formosa/css/style750u?action=raw&ctype=text/css"> | ||
+ | <link rel="stylesheet" media="only screen and (max-width: 600px)" href="https://2013.igem.org/Team:NCTU_Formosa/css/style320b?action=raw&ctype=text/css"> | ||
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> | <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> | ||
<script src="https://2013.igem.org/Team:Team:NCTU_Formosa/js/modernizr.custom?action=raw&ctype=text/javascript"></script> | <script src="https://2013.igem.org/Team:Team:NCTU_Formosa/js/modernizr.custom?action=raw&ctype=text/javascript"></script> | ||
<script> | <script> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
$(function() { | $(function() { | ||
- | + | var lastId, | |
- | + | topMenu = $("#toc"), | |
- | + | topMenuHeight = 35, | |
+ | menuItems = topMenu.find("a"), | ||
+ | scrollItems = menuItems.map(function(){ | ||
+ | var item = $($(this).attr("href")); | ||
+ | if (item.length) { return item; } | ||
+ | }), | ||
+ | noScrollAction = false; | ||
+ | |||
+ | menuItems.click(function(e){ | ||
+ | var href = $(this).attr("href"), | ||
+ | offsetTop = href === "#" ? 0 : $(href).offset().top-topMenuHeight+1; | ||
+ | noScrollAction = true; | ||
+ | $('html, body').stop().animate({ | ||
+ | scrollTop: offsetTop | ||
+ | },{ | ||
+ | duration: 300, | ||
+ | complete: function() { | ||
+ | menuItems | ||
+ | .parent().removeClass("active") | ||
+ | .end().filter("[href=" + href +"]").parent().addClass("active"); | ||
+ | menuItems | ||
+ | .closest(".toclevel-1").removeClass("active") | ||
+ | .end().filter("[href=" + href +"]").closest(".toclevel-1").addClass("active"); | ||
+ | menuItems | ||
+ | .closest(".toclevel-2").removeClass("active") | ||
+ | .end().filter("[href=" + href +"]").closest(".toclevel-2").addClass("active"); | ||
+ | setTimeout(function(){ noScrollAction = false; }, 10); | ||
+ | } | ||
}); | }); | ||
+ | e.preventDefault(); | ||
+ | }); | ||
+ | $(window).scroll(function(){ | ||
+ | if(!noScrollAction){ | ||
+ | var fromTop = $(this).scrollTop()+topMenuHeight; | ||
+ | var cur = scrollItems.map(function(){ | ||
+ | if ($(this).offset().top < fromTop) | ||
+ | return this; | ||
+ | }); | ||
+ | cur = cur[cur.length-1]; | ||
+ | var chk=0; | ||
+ | if(cur) if(cur.length) chk=1; | ||
+ | var id = chk ? cur[0].id : ""; | ||
+ | |||
+ | if (lastId !== id) { | ||
+ | lastId = id; | ||
+ | menuItems | ||
+ | .parent().removeClass("active") | ||
+ | .end().filter("[href=#"+id+"]").parent().addClass("active"); | ||
+ | menuItems | ||
+ | .closest(".toclevel-1").removeClass("active") | ||
+ | .end().filter("[href=#"+id+"]").closest(".toclevel-1").addClass("active"); | ||
+ | menuItems | ||
+ | .closest(".toclevel-2").removeClass("active") | ||
+ | .end().filter("[href=#"+id+"]").closest(".toclevel-2").addClass("active"); | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | }) | ||
+ | $(document).ready(function(){ | ||
+ | if ($(document).scrollTop() > 409) { | ||
+ | $('#toc').stop().css({ | ||
+ | position: 'fixed', | ||
+ | left: '15px' | ||
+ | }).animate({'top': '111px'}, 500); | ||
+ | } | ||
+ | var long = false, | ||
+ | dheight = $(document).height(), | ||
+ | wheight = $(window).height(); | ||
+ | if($('#toc').height()+100>wheight) { long=true; } | ||
+ | var away = false; | ||
+ | $(document).scroll(function() { | ||
+ | if ($(document).scrollTop() > dheight/2) { | ||
+ | if (!away) { | ||
+ | if (long){ | ||
+ | away = true; | ||
+ | $('#toc').stop().css({ | ||
+ | position: 'fixed', | ||
+ | left: '15px' | ||
+ | }).animate({'top': -22-$('#toc').height()+wheight+'px'}, 500); | ||
+ | }} | ||
+ | } else { | ||
+ | away = false; | ||
+ | if ($(document).scrollTop() < 431){ | ||
+ | $('#toc').stop().css({ | ||
+ | position: 'absolute', | ||
+ | left: '-265px' | ||
+ | }).animate({'top': '0px'}, 500); | ||
+ | } | ||
+ | else { | ||
+ | $('#toc').stop().css({ | ||
+ | position: 'fixed', | ||
+ | left: '15px' | ||
+ | }).animate({'top': '111px'}, 500); | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | $(window).resize(function() { | ||
+ | dheight = $(document).height(); | ||
+ | wheight = $(window).height(); | ||
+ | if($('#toc').height()+100>wheight) { long=true; } else {long=false;} | ||
+ | if($(window).width()<943) { | ||
+ | $('.changeFontText').css({opacity: '0.01'}); | ||
+ | $('.changeFontArrow').css({opacity: '0.01'}); | ||
+ | } else { | ||
+ | |||
+ | $('.changeFontText').css({opacity: '1'}); | ||
+ | $('.changeFontArrow').css({opacity: '1'}); | ||
+ | } | ||
+ | }); | ||
+ | var originalFontSize = $('.card').css('font-size'); | ||
+ | $(".resetFont").click(function(){ | ||
+ | $('.card').css('font-size', originalFontSize); | ||
+ | return false; | ||
+ | }); | ||
+ | $(".increaseFont").click(function(){ | ||
+ | var currentFontSize = $('.card').css('font-size'); | ||
+ | var currentFontSizeNum = parseFloat(currentFontSize, 10); | ||
+ | var newFontSize = currentFontSizeNum*1.2; | ||
+ | $('.card').css('font-size', newFontSize); | ||
+ | return false; | ||
+ | }); | ||
+ | $(".decreaseFont").click(function(){ | ||
+ | var currentFontSize = $('.card').css('font-size'); | ||
+ | var currentFontSizeNum = parseFloat(currentFontSize, 10); | ||
+ | var newFontSize = currentFontSizeNum*0.8; | ||
+ | $('.card').css('font-size', newFontSize); | ||
+ | return false; | ||
+ | }); | ||
+ | $("#back-top").hide(); | ||
+ | $(function () { | ||
+ | $(window).scroll(function () { | ||
+ | if ($(this).scrollTop() > 100) { | ||
+ | $('#back-top').fadeIn(); | ||
+ | } else { | ||
+ | $('#back-top').fadeOut(); | ||
+ | } | ||
+ | }); | ||
+ | $('#back-top a').click(function () { | ||
+ | $('body,html').animate({ | ||
+ | scrollTop: 0 | ||
+ | }, 500); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
}); | }); | ||
</script> | </script> |
Latest revision as of 13:28, 15 September 2014