Team:SYSU-China/js/project.js
From 2014.igem.org
(24 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
- | + | $(function() { | |
var navicon = ["Project", "Judging", "HumanPractice", "Team"]; | var navicon = ["Project", "Judging", "HumanPractice", "Team"]; | ||
var urlHash = ["Project/Background", "Judging/Safetyform", "HumanPractice/iGEMCC", "Team/Ourteam"]; | var urlHash = ["Project/Background", "Judging/Safetyform", "HumanPractice/iGEMCC", "Team/Ourteam"]; | ||
Line 12: | Line 12: | ||
"https://static.igem.org/mediawiki/2014/5/5e/Sysuchina_bg34.png", | "https://static.igem.org/mediawiki/2014/5/5e/Sysuchina_bg34.png", | ||
"https://static.igem.org/mediawiki/2014/7/74/Sysuchina_bg33.png", | "https://static.igem.org/mediawiki/2014/7/74/Sysuchina_bg33.png", | ||
- | |||
"https://static.igem.org/mediawiki/2014/2/27/Sysuchina_bg35.png"]; | "https://static.igem.org/mediawiki/2014/2/27/Sysuchina_bg35.png"]; | ||
$(".dl-menu").each(function(i) { | $(".dl-menu").each(function(i) { | ||
Line 79: | Line 78: | ||
$.get( | $.get( | ||
"https://2014.igem.org/Team:SYSU-China/file/" + lochash + ".html?action=raw", | "https://2014.igem.org/Team:SYSU-China/file/" + lochash + ".html?action=raw", | ||
+ | |||
function(data){ | function(data){ | ||
- | realdata = data.substring(data.indexOf("<!--SYSUCHINA-->"),data.indexOf("<!--SYSUCHINA!-->")); | + | var realdata = data.substring(data.indexOf("<!--SYSUCHINA-->"),data.indexOf("<!--SYSUCHINA!-->")); |
- | + | setTimeout(function() { | |
- | + | $($(".content")[0]).html(realdata); | |
- | + | }, 100); | |
} | } | ||
); | ); | ||
+ | gotoTop(1); | ||
} | } | ||
Line 93: | Line 94: | ||
function top() { | function top() { | ||
- | + | $("#gotop").click(function() { | |
- | $("# | + | gotoTop(100); |
- | + | ||
- | gotoTop( | + | |
}); | }); | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
function jQueryHash() { // hash change listener | function jQueryHash() { // hash change listener | ||
Line 185: | Line 171: | ||
}); | }); | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
function linkHome() { | function linkHome() { | ||
$(".single-item img").each(function() { | $(".single-item img").each(function() { | ||
$(this).click(function() { | $(this).click(function() { | ||
- | location.href = " | + | location.href = "https://2014.igem.org/Team:SYSU-China"; |
}); | }); | ||
}); | }); | ||
Line 221: | Line 189: | ||
var Navhover = [false, false, false, false, false]; | var Navhover = [false, false, false, false, false]; | ||
function navigation() { | function navigation() { | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
$(".navibar img").each(function(index) { | $(".navibar img").each(function(index) { | ||
$(this).hover( function() { | $(this).hover( function() { | ||
Line 275: | Line 219: | ||
$(window).resize(function() { | $(window).resize(function() { | ||
- | |||
//document.location.reload(); | //document.location.reload(); | ||
}); | }); | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } | ||
- | + | /* | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
function modal() { | function modal() { | ||
$('#myModal').reveal({ | $('#myModal').reveal({ | ||
Line 305: | Line 231: | ||
}); | }); | ||
} | } | ||
+ | */ | ||
function sidenav() { | function sidenav() { | ||
$( '#dl-menu' ).dlmenu(); | $( '#dl-menu' ).dlmenu(); | ||
Line 312: | Line 239: | ||
function ini() { | function ini() { | ||
- | |||
//alert("sd"); | //alert("sd"); | ||
$(".dl-menu").each(function() { | $(".dl-menu").each(function() { | ||
Line 329: | Line 255: | ||
navigationSet(); | navigationSet(); | ||
- | + | ||
jQueryHash(); | jQueryHash(); | ||
flexnavi(); | flexnavi(); | ||
Line 336: | Line 262: | ||
setTimeout(Tips, 50); | setTimeout(Tips, 50); | ||
linkHome(); | linkHome(); | ||
- | imgbox(); | + | //imgbox(); |
navigation(); | navigation(); | ||
//modal(); | //modal(); | ||
sidenav(); | sidenav(); | ||
+ | top(); | ||
} | } |
Latest revision as of 01:43, 18 October 2014
$(function() { var navicon = ["Project", "Judging", "HumanPractice", "Team"]; var urlHash = ["Project/Background", "Judging/Safetyform", "HumanPractice/iGEMCC", "Team/Ourteam"]; var colors = ["#b5c90f", "#ed8f6b", "#7aa59e", "#ed9d60"];
function navigationSet() { var icon1 = ["", "", "", ""]; var icon2 = ["", "", "", ""]; $(".dl-menu").each(function(i) { $(this).css("background-color", colors[i]); $(this).children().each(function() { $($(this).children()[1]).css("background-color", colors[i]); }); }); $(".navibar img").each(function(index) { $(this).hover(function() { var newSrc = $(this).attr("src").replace(icon2[index], icon1[index]); $(this).attr("src", newSrc); //$(this).css({"width" : "45px", "height" : "45px"}); }, function() { var newSrc = $(this).attr("src").replace(icon1[index], icon2[index]); $(this).attr("src", newSrc); //$(this).css({"width" : "40px", "height" : "40px"}); }).trigger("mousehover");
$(this).click(function() { gotoTop(1); var hrefhash = urlHash[index]; $.locationHash(hrefhash); }); }); }
function fixscroll() { //获取要定位元素距离浏览器顶部的距离 var navH = $($(".navibar")[0]).position().top; var nav2H = $($(".navigation2")[0]).position().top;
//滚动条事件 $(window).scroll(function(){ //获取滚动条的滑动距离 var scroH = $(document).scrollTop(); //滚动条的滑动距离大于等于定位元素距离浏览器顶部的距离,就固定,反之就不固定 if(scroH >= navH){ $(".navibar").css({"position":"fixed","top":"0"}); } else if(scroH < navH){ $(".navibar").css({"position":"absolute", "top" : "204px"}); }
if(scroH >= nav2H){ $(".navigation2").css({"position":"fixed","top": "60px"}); } else if(scroH < nav2H){ $(".navigation2").css({"position":"absolute", "top" : "264px"}); } }); }
function stopBubble(e) {
// 如果提供了事件对象,则这是一个非IE浏览器
if ( e && e.stopPropagation ) { // 因此它支持W3C的stopPropagation()方法 e.stopPropagation(); } else { // 否则,我们需要使用IE的方式来取消事件冒泡 window.event.cancelBubble = true;
} }
function requestFile() { var lochash = $.locationHash(); $.get( "https://2014.igem.org/Team:SYSU-China/file/" + lochash + ".html?action=raw",
function(data){ var realdata = data.substring(data.indexOf(""),data.indexOf(""));
setTimeout(function() {
$($(".content")[0]).html(realdata);
}, 100);
} );
gotoTop(1);
}
function gotoTop(speed) { $('body,html').animate({scrollTop:0},speed); }
function top() { $("#gotop").click(function() { gotoTop(100);
}); }
function jQueryHash() { // hash change listener $(window).hashchange(function() { /*change page position*/ /*change file*/ requestFile(); $('.single-item div').each(function() { $(this).hide(); }); /*change top image*/ var hash = $.locationHash(); var hashlist = hash = hash.split('/'); var hashnum = hashlist.length; var index = navicon.indexOf(hashlist[0]); if (hash != "" && hashnum == 0) { hashlist.push(hash); hashnum = 1; } if (hashnum == 0) { $($('.single-item div')[0]).show(); } else { if (index != -1) $($('.single-item div')[index]).show(); } $(".dl-menu").each(function() { $(this).hide(); }); $($(".dl-menu")[index]).show(); $($("#sidenav button")[0]).css("background-color", colors[index]); }); }
var showTip = false;
function Tips() { $("#tip em").each(function(i, v) { $(this).hoverDelay({ hoverDuring: 200, outDuring: 200, hoverEvent: function() { var tooltipPosTop = $(this).position().top- $("#tipImg").outerHeight(); //alert(tooltipPosTop); var tooltipPosLeft = $(this).position().left; var tooltipPosLeft = tooltipPosLeft - (($("#tipImg").outerWidth()/2) - $(this).outerWidth()/2);
$("#tipImg").css({ 'left': tooltipPosLeft + "px", 'top': tooltipPosTop+"px" }).animate({'opacity':'1', 'marginTop':'0'}, 500); $("#tipImg").show(); }, outEvent: function() { showTip = true;
setTimeout(function() { if (showTip) { $("#tipImg").fadeOut(100); showTip = false;// do nothing } }, 200); } }); });
$("#tipImg").hoverDelay({ hoverDuring: 200, outDuring: 200, hoverEvent: function() { showTip = false; }, outEvent: function() { $("#tipImg").fadeOut(100); } }); }
function linkHome() { $(".single-item img").each(function() { $(this).click(function() { location.href = "https://2014.igem.org/Team:SYSU-China"; }); }); } function imgbox() { $(".fancybox").fancybox(); }
function flexnavi() { $(".flexnav").flexNav(); }
var Navhover = [false, false, false, false, false]; function navigation() { $(".navibar img").each(function(index) { $(this).hover( function() { $($(".firstNav")[index]).show();
}, function() {
setTimeout(function(){ if (!Navhover[index]) { //$($(".firstNav")[index]).trigger("mouseleave"); $($(".firstNav")[index]).hide(); Navhover[index] = false; } }, 50); });
});
$(".firstNav").each(function(index) { $(this).hover(function() { Navhover[index] = true; }, function() { Navhover[index] = false; $($(".firstNav")[index]).hide(); }).trigger("mousehover"); });
$(".firstNav").each(function() {
$(this).hide(); });
$(window).resize(function() {
//document.location.reload();
});
}
/* function modal() { $('#myModal').reveal({
animation: 'fadeAndPop', //fade, fadeAndPop, none animationspeed: 300, //how fast animtions are closeonbackgroundclick: true, //if you click background will modal close? dismissmodalclass: 'close-reveal-modal', //the class of a button or element that will close an open modal
}); }
- /
function sidenav() { $( '#dl-menu' ).dlmenu(); $($("#dl-menu button")[0]).trigger("click"); }
function ini() {
//alert("sd");
$(".dl-menu").each(function() {
$(this).hide();
});
$($(".dl-menu")[0]).show();
$("#tipImg").hide();
$($(".dl-menu")[0]).show();
var currentHash = $.locationHash();
//getPage(); //routeTree(); navigationSet();
jQueryHash();
flexnavi();
//Tips();
setTimeout(fixscroll, 10);
setTimeout(Tips, 50);
linkHome();
//imgbox();
navigation();
//modal();
sidenav();
top();
}
ini();
});