Difference between revisions of "Team:SSTi-SZGD/js/btn"
YuhangYang (Talk | contribs) m |
YuhangYang (Talk | contribs) m |
||
| (20 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
$(function(){ | $(function(){ | ||
| + | |||
| + | $(".btn_nav").addClass("transition"); | ||
| + | $(".btn_nav").find("*").addClass("transition"); | ||
| + | |||
| + | if(window.location.search==""){ | ||
| + | $(".btn_language").css("background-image","url(https://static.igem.org/mediawiki/2018/b/bb/T--SSTi-SZGD--LanguageEN.png)"); | ||
| + | }else{ | ||
| + | $(".btn_language").css("background-image","url(https://static.igem.org/mediawiki/2018/7/7a/T--SSTi-SZGD--LanguageZH.png)"); | ||
| + | } | ||
| + | |||
| + | //Translater | ||
| + | var tran = new Translater({ | ||
| + | lang:"en" | ||
| + | }); | ||
| + | |||
//dispaly | //dispaly | ||
| − | if($(window).height()>480&&$(window).scrollTop() | + | if($(window).height()>480&&$(window).scrollTop()>=16){ |
$(".btn_top").removeClass("fadeOutRight").addClass("fadeInRight"); | $(".btn_top").removeClass("fadeOutRight").addClass("fadeInRight"); | ||
setTimeout(function(){ | setTimeout(function(){ | ||
| Line 13: | Line 28: | ||
},500); | },500); | ||
} | } | ||
| − | + | if($(window).height()<480){ | |
| + | $(".btn_top").css("display","none"); | ||
| + | } | ||
$(window).scroll(function(){ | $(window).scroll(function(){ | ||
| − | if($(window).height()>480&&$(window).scrollTop() | + | if($(window).height()>=480&&$(window).scrollTop()>=16){ |
$(".btn_top").removeClass("fadeOutRight").addClass("fadeInRight"); | $(".btn_top").removeClass("fadeOutRight").addClass("fadeInRight"); | ||
setTimeout(function(){ | setTimeout(function(){ | ||
| Line 27: | Line 44: | ||
} | } | ||
}); | }); | ||
| − | if($(window). | + | |
| − | $(".btn_top").css("display","none"); | + | if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry|iPad/i.test(navigator.userAgent)){ |
| + | $(".btn_top").css("bottom","180px"); | ||
| + | $(".btn_language").css("bottom","110px"); | ||
| + | $(".btn_menu").css("bottom","40px"); | ||
| + | $(".btn_menu").css("display","block"); | ||
| + | }else{ | ||
| + | if($(window).width()<751){ | ||
| + | $(".btn_top").css("bottom","180px"); | ||
| + | $(".btn_language").css("bottom","110px"); | ||
| + | $(".btn_menu").css("bottom","40px"); | ||
| + | $(".btn_menu").css("display","block"); | ||
| + | }else{ | ||
| + | $(".btn_menu").css("display","none"); | ||
| + | $(".btn_top").css("bottom","155px"); | ||
| + | $(".btn_language").css("bottom","85px"); | ||
| + | $(".btn_nav").css("display","none"); | ||
| + | $("html,body").css({"height":"","overflow":""}); | ||
| + | var scrollTop=sessionStorage.getItem("scrollTop"); | ||
| + | if(Cbtn_nav==1){ | ||
| + | sessionStorage.setItem("offsetTop",scrollTop); | ||
| + | $(document).scrollTop(scrollTop); | ||
| + | Cbtn_nav=0; | ||
| + | } | ||
| + | if(window.location.href.indexOf("Safety")!=-1){ | ||
| + | clearInterval(Team_Time); | ||
| + | Team_Time=setInterval("Team_ScrollRight()",3000); | ||
| + | } | ||
| + | } | ||
} | } | ||
| + | |||
| + | |||
$(window).resize(function(){ | $(window).resize(function(){ | ||
| − | if($(window).height() | + | if($(window).height()>=480&&$(window).scrollTop()>=16){ |
| + | $(".btn_top").removeClass("fadeOutRight").addClass("fadeInRight"); | ||
| + | setTimeout(function(){ | ||
| + | $(".btn_top").css("display","block"); | ||
| + | },500); | ||
| + | }else{ | ||
| + | $(".btn_top").removeClass("fadeInRight").addClass("fadeOutRight"); | ||
| + | setTimeout(function(){ | ||
| + | $(".btn_top").css("display","none"); | ||
| + | },500); | ||
| + | } | ||
| + | if($(window).height()<480){ | ||
$(".btn_top").css("display","none"); | $(".btn_top").css("display","none"); | ||
| + | } | ||
| + | if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry|iPad/i.test(navigator.userAgent)){ | ||
| + | $(".btn_top").css("bottom","180px"); | ||
| + | $(".btn_language").css("bottom","110px"); | ||
| + | $(".btn_menu").css("bottom","40px"); | ||
| + | $(".btn_menu").css("display","block"); | ||
| + | }else{ | ||
| + | if($(window).width()<751){ | ||
| + | $(".btn_top").css("bottom","180px"); | ||
| + | $(".btn_language").css("bottom","110px"); | ||
| + | $(".btn_menu").css("bottom","40px"); | ||
| + | $(".btn_menu").css("display","block"); | ||
| + | }else{ | ||
| + | $(".btn_menu").css("display","none"); | ||
| + | $(".btn_top").css("bottom","155px"); | ||
| + | $(".btn_language").css("bottom","85px"); | ||
| + | $(".btn_nav").css("display","none"); | ||
| + | $("html,body").css({"height":"","overflow":""}); | ||
| + | var scrollTop=sessionStorage.getItem("scrollTop"); | ||
| + | if(Cbtn_nav==1){ | ||
| + | sessionStorage.setItem("offsetTop",scrollTop); | ||
| + | $(document).scrollTop(scrollTop); | ||
| + | Cbtn_nav=0; | ||
| + | } | ||
| + | if(window.location.href.indexOf("Safety")!=-1){ | ||
| + | clearInterval(Team_Time); | ||
| + | Team_Time=setInterval("Team_ScrollRight()",3000); | ||
| + | } | ||
| + | } | ||
} | } | ||
}); | }); | ||
| + | |||
//hover | //hover | ||
| Line 52: | Line 139: | ||
$(this).css("background-color","#fff"); | $(this).css("background-color","#fff"); | ||
}); | }); | ||
| + | |||
//click | //click | ||
| Line 58: | Line 146: | ||
$("html,body").stop().animate({scrollTop: '0px'},800); | $("html,body").stop().animate({scrollTop: '0px'},800); | ||
$(this).css("background-color","#fff"); | $(this).css("background-color","#fff"); | ||
| + | |||
| + | }); | ||
| + | |||
| + | //onload时，取出并滚动到上次保存位置 | ||
| + | window.onload=function(){ | ||
| + | var Chref=sessionStorage.getItem("Chref"); | ||
| + | var offset=sessionStorage.getItem("offsetTop"); | ||
| + | if(Chref==1){ | ||
| + | $(document).scrollTop(offset); | ||
| + | sessionStorage.setItem("Chref",0); | ||
| + | } | ||
| + | }; | ||
| + | |||
| + | //滚动时保存滚动位置 | ||
| + | $(window).scroll(function(){ | ||
| + | sessionStorage.setItem("offsetTop",$(window).scrollTop()); | ||
| + | }); | ||
| + | |||
| + | $(".btn_language").click(function(){ | ||
| + | |||
| + | if(Cbtn_nav==1){ | ||
| + | var scrollTop=sessionStorage.getItem("scrollTop"); | ||
| + | sessionStorage.setItem("offsetTop",scrollTop); | ||
| + | }else{ | ||
| + | sessionStorage.setItem("offsetTop",$(window).scrollTop()); | ||
| + | } | ||
| + | sessionStorage.setItem("Chref",1); | ||
| + | if(window.location.search==""){ | ||
| + | window.location.href+="?lang=cn"; | ||
| + | }else{ | ||
| + | window.location.href=""+window.location.href.split('?')[0]; | ||
| + | } | ||
}); | }); | ||
| Line 71: | Line 191: | ||
$(this).css("background-color","#eee"); | $(this).css("background-color","#eee"); | ||
Cbtn_nav=1; | Cbtn_nav=1; | ||
| + | setTimeout(function(){ | ||
| + | $("html,body").css({"height":"100%","overflow":"hidden"}); | ||
| + | },1200); | ||
| + | sessionStorage.setItem("scrollTop",$(window).scrollTop()); | ||
}else{ | }else{ | ||
$(".btn_nav").removeClass("fadeInDownBig").addClass("fadeOutUpBig"); | $(".btn_nav").removeClass("fadeInDownBig").addClass("fadeOutUpBig"); | ||
| Line 78: | Line 202: | ||
$(this).css("background-color","#fff"); | $(this).css("background-color","#fff"); | ||
Cbtn_nav=0; | Cbtn_nav=0; | ||
| + | $("html,body").css({"height":"","overflow":""}); | ||
| + | var scrollTop=sessionStorage.getItem("scrollTop"); | ||
| + | $(document).scrollTop(scrollTop); | ||
} | } | ||
}); | }); | ||
| + | |||
//touch | //touch | ||
| Line 101: | Line 229: | ||
$(this).css("background-color","#fff"); | $(this).css("background-color","#fff"); | ||
}); | }); | ||
| + | |||
}); | }); | ||
Latest revision as of 17:05, 4 November 2018
$(function(){
$(".btn_nav").addClass("transition"); $(".btn_nav").find("*").addClass("transition");
if(window.location.search==""){
$(".btn_language").css("background-image","url(
)");
}else{
$(".btn_language").css("background-image","url(
)");
}
//Translater var tran = new Translater({ lang:"en" });
//dispaly
if($(window).height()>480&&$(window).scrollTop()>=16){
$(".btn_top").removeClass("fadeOutRight").addClass("fadeInRight");
setTimeout(function(){
$(".btn_top").css("display","block");
},500);
}else{
$(".btn_top").removeClass("fadeInRight").addClass("fadeOutRight");
setTimeout(function(){
$(".btn_top").css("display","none");
},500);
}
if($(window).height()<480){
$(".btn_top").css("display","none");
}
$(window).scroll(function(){
if($(window).height()>=480&&$(window).scrollTop()>=16){
$(".btn_top").removeClass("fadeOutRight").addClass("fadeInRight");
setTimeout(function(){
$(".btn_top").css("display","block");
},500);
}else{
$(".btn_top").removeClass("fadeInRight").addClass("fadeOutRight");
setTimeout(function(){
$(".btn_top").css("display","none");
},500);
}
});
if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry|iPad/i.test(navigator.userAgent)){ $(".btn_top").css("bottom","180px"); $(".btn_language").css("bottom","110px"); $(".btn_menu").css("bottom","40px"); $(".btn_menu").css("display","block"); }else{ if($(window).width()<751){ $(".btn_top").css("bottom","180px"); $(".btn_language").css("bottom","110px"); $(".btn_menu").css("bottom","40px"); $(".btn_menu").css("display","block"); }else{ $(".btn_menu").css("display","none"); $(".btn_top").css("bottom","155px"); $(".btn_language").css("bottom","85px"); $(".btn_nav").css("display","none"); $("html,body").css({"height":"","overflow":""}); var scrollTop=sessionStorage.getItem("scrollTop"); if(Cbtn_nav==1){ sessionStorage.setItem("offsetTop",scrollTop); $(document).scrollTop(scrollTop); Cbtn_nav=0; } if(window.location.href.indexOf("Safety")!=-1){ clearInterval(Team_Time); Team_Time=setInterval("Team_ScrollRight()",3000); } } }
$(window).resize(function(){
if($(window).height()>=480&&$(window).scrollTop()>=16){
$(".btn_top").removeClass("fadeOutRight").addClass("fadeInRight");
setTimeout(function(){
$(".btn_top").css("display","block");
},500);
}else{
$(".btn_top").removeClass("fadeInRight").addClass("fadeOutRight");
setTimeout(function(){
$(".btn_top").css("display","none");
},500);
}
if($(window).height()<480){
$(".btn_top").css("display","none");
}
if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry|iPad/i.test(navigator.userAgent)){
$(".btn_top").css("bottom","180px");
$(".btn_language").css("bottom","110px");
$(".btn_menu").css("bottom","40px");
$(".btn_menu").css("display","block");
}else{
if($(window).width()<751){
$(".btn_top").css("bottom","180px");
$(".btn_language").css("bottom","110px");
$(".btn_menu").css("bottom","40px");
$(".btn_menu").css("display","block");
}else{
$(".btn_menu").css("display","none");
$(".btn_top").css("bottom","155px");
$(".btn_language").css("bottom","85px");
$(".btn_nav").css("display","none");
$("html,body").css({"height":"","overflow":""});
var scrollTop=sessionStorage.getItem("scrollTop");
if(Cbtn_nav==1){
sessionStorage.setItem("offsetTop",scrollTop);
$(document).scrollTop(scrollTop);
Cbtn_nav=0;
}
if(window.location.href.indexOf("Safety")!=-1){
clearInterval(Team_Time);
Team_Time=setInterval("Team_ScrollRight()",3000);
}
}
}
});
//hover
$(".btn_top").hover(function(){
$(this).css("background-color","#eee");
},function(){
$(this).css("background-color","#fff");
});
$(".btn_language").hover(function(){
$(this).css("background-color","#eee");
},function(){
$(this).css("background-color","#fff");
});
$(".btn_menu").hover(function(){
$(this).css("background-color","#eee");
},function(){
$(this).css("background-color","#fff");
});
//click
$(".btn_top").click(function(){
$("html,body").stop().animate({scrollTop: '0px'},800); $(this).css("background-color","#fff");
});
//onload时，取出并滚动到上次保存位置 window.onload=function(){ var Chref=sessionStorage.getItem("Chref"); var offset=sessionStorage.getItem("offsetTop"); if(Chref==1){ $(document).scrollTop(offset); sessionStorage.setItem("Chref",0); } };
//滚动时保存滚动位置 $(window).scroll(function(){ sessionStorage.setItem("offsetTop",$(window).scrollTop()); });
$(".btn_language").click(function(){
if(Cbtn_nav==1){ var scrollTop=sessionStorage.getItem("scrollTop"); sessionStorage.setItem("offsetTop",scrollTop); }else{ sessionStorage.setItem("offsetTop",$(window).scrollTop()); } sessionStorage.setItem("Chref",1); if(window.location.search==""){ window.location.href+="?lang=cn"; }else{ window.location.href=""+window.location.href.split('?')[0]; }
});
var Cbtn_nav=0; $(".btn_menu").click(function(){
if(Cbtn_nav==0){ $(".btn_nav").removeClass("fadeOutUpBig").addClass("fadeInDownBig"); setTimeout(function(){ $(".btn_nav").css("display","block"); },500); $(this).css("background-color","#eee"); Cbtn_nav=1; setTimeout(function(){ $("html,body").css({"height":"100%","overflow":"hidden"}); },1200); sessionStorage.setItem("scrollTop",$(window).scrollTop()); }else{ $(".btn_nav").removeClass("fadeInDownBig").addClass("fadeOutUpBig"); setTimeout(function(){ $(".btn_nav").css("display","none"); },500); $(this).css("background-color","#fff"); Cbtn_nav=0; $("html,body").css({"height":"","overflow":""}); var scrollTop=sessionStorage.getItem("scrollTop"); $(document).scrollTop(scrollTop); }
});
//touch
$(".btn_top").on("touchstart",function(){
$(this).css("background-color","#eee");
});
$(".btn_top").on("touchend",function(){
$(this).css("background-color","#fff");
});
$(".btn_language").on("touchstart",function(){
$(this).css("background-color","#eee");
});
$(".btn_language").on("touchend",function(){
$(this).css("background-color","#fff");
});
$(".btn_menu").on("touchstart",function(){
$(this).css("background-color","#eee");
});
$(".btn_menu").on("touchend",function(){
$(this).css("background-color","#fff");
});
});