Team:Goettingen/suplement/scripts
From 2013.igem.org
(Difference between revisions)
m |
|||
(62 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
- | + | <html> | |
- | + | <script> | |
- | + | function showDro(ob){ | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
+ | var sib = ob.nextElementSibling || getNextElementSibling(ob); | ||
+ | var par = ob.parentElement; | ||
+ | |||
+ | |||
+ | //alert(sib); | ||
+ | sib.style.top = calDefTop(par) + par.clientHeight -1 + 'px'; | ||
+ | sib.style.left = ob.offsetLeft + 'px'; | ||
+ | |||
+ | sib.style.display = 'block'; | ||
+ | ob.style.backgroundColor = '#8f0000';ob.style.color = 'white'; | ||
+ | sib.onmouseover = function(){sib.style.display = 'block';ob.style.backgroundColor = '#8f0000';ob.style.color = 'white';} | ||
+ | sib.onmouseout = function(){sib.style.display = 'none';ob.style.backgroundColor ='';ob.style.color = '';} | ||
+ | ob.onmouseout = function(){sib.style.display = 'none';ob.style.backgroundColor ='';ob.style.color = '';} | ||
+ | |||
+ | |||
+ | } | ||
+ | |||
+ | //与jq中的toggle函数相似,简化版本 | ||
+ | function toggle(target){ | ||
+ | if(getComputedStyle(target,null).display == "none"){ | ||
+ | target.style.display = "block" | ||
+ | } else {target.style.display = "none"} | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | function getOrgStyle(ob){ | ||
+ | var bkgc = window.getComputedStyle(ob,null).backgroundColor; | ||
+ | var color = window.getComputedStyle(ob,null).color; | ||
+ | var elm = {'backgroundColor':bkgc,'color':color} | ||
+ | return elm; | ||
+ | } | ||
+ | |||
+ | //4 slides | ||
function fadeInOut() | function fadeInOut() | ||
{ | { | ||
$("#slide").fadeOut(300,function(){ | $("#slide").fadeOut(300,function(){ | ||
- | + | //alert(picSlide_i); | |
- | document.getElementById("slide").src=e[ | + | document.getElementById("slide").src=e[picSlide_i]; |
- | + | document.getElementById("slide-a").href = link[picSlide_i]; | |
+ | picSlide_i++; | ||
+ | //alert(picSlide_i); | ||
$("#slide").fadeIn(300,slide_ctrl()); | $("#slide").fadeIn(300,slide_ctrl()); | ||
}); | }); | ||
Line 39: | Line 54: | ||
- | function | + | function startslide() |
{ | { | ||
- | + | if(picSlide_i >= e.length) picSlide_i = 0; | |
- | + | ||
fadeInOut(); | fadeInOut(); | ||
- | |||
$("#resume").hide(); | $("#resume").hide(); | ||
$("#stop").show(); | $("#stop").show(); | ||
- | + | timer = setTimeout("startslide()",5000); | |
- | timer = setTimeout(" | + | |
}; | }; | ||
- | function | + | function stopslide() |
{ | { | ||
clearTimeout(timer); | clearTimeout(timer); | ||
- | |||
$("#pause").hide(); | $("#pause").hide(); | ||
$("#resume").show(); | $("#resume").show(); | ||
Line 61: | Line 72: | ||
function go2right(){ | function go2right(){ | ||
- | + | fadeInOut(); | |
- | + | ||
} | } | ||
function slide_ctrl(){ | function slide_ctrl(){ | ||
var x = 0; | var x = 0; | ||
- | var text = '<span id="slide-ctrl-1" | + | var text = '<span id="slide-ctrl-1">'; |
- | for(x=0;x< | + | for(x=0;x<e.length;x++){ |
- | if (x==( | + | if (x==(picSlide_i-1)) { text += '<img src="https://static.igem.org/mediawiki/2013/9/9d/Goe-this.png" />' ;} |
- | else { text += '<img src="https://static.igem.org/mediawiki/2013/4/4c/Goe-notThis.png" onclick=" | + | else { text += '<img src="https://static.igem.org/mediawiki/2013/4/4c/Goe-notThis.png" onclick="picSlide_i = ' + x + ';stopslide(); startslide()" />';} |
}; | }; | ||
- | text += ' | + | text += '</span>'; |
- | text += '<img src="https://static.igem.org/mediawiki/2013/b/b6/Goe-pause.png" alt="pause" id="pause" onclick=" | + | text += '<img src="https://static.igem.org/mediawiki/2013/b/b6/Goe-pause.png" alt="pause" id="pause" onclick="stopslide()" /><img src="https://static.igem.org/mediawiki/2013/b/b1/Goe-resume.png" alt="resume" id="resume" onclick="startslide()" style="display:none" />'; |
- | + | ||
- | + | ||
document.getElementById("slide-ctrl").innerHTML = text; | document.getElementById("slide-ctrl").innerHTML = text; | ||
} | } | ||
Line 81: | Line 90: | ||
function go2left(){ | function go2left(){ | ||
stoptimer(); | stoptimer(); | ||
- | if ( | + | if (picSlide_i == 0) picSlide_i = 5; |
- | + | picSlide_i = picSlide_i - 2; | |
- | if ( | + | if (picSlide_i < 0) picSlide_i =2; |
- | + | fadeInOut(); | |
} | } | ||
+ | |||
+ | var ob1; | ||
+ | var rTop = 0; | ||
function fixedpo() | function fixedpo() | ||
- | { | + | { var sTop = document.getElementsByTagName('body')[0].scrollTop; |
- | + | if(sTop > rTop) {ob1.style.position = 'fixed'; | |
- | + | ob1.style.top = '0px'; | |
- | if(sTop > rTop) { | + | ob1.style.width = '27%'} |
- | + | else {ob1.style.position =''; ob1.style.top = '';ob1.style.width = ''} | |
- | else { | + | |
- | + | ||
+ | |||
} | } | ||
+ | |||
+ | function calDefTop(ob){ | ||
+ | var dTop = 0; | ||
+ | while( ob != null){ | ||
+ | dTop += ob.offsetTop; | ||
+ | //ob.innerHTML += dTop+ ' '; | ||
+ | ob = ob.offsetParent;} | ||
+ | return dTop; | ||
+ | } | ||
+ | |||
+ | function calDefLeft(ob){ | ||
+ | var dLeft = 0; | ||
+ | while( ob != null){ | ||
+ | dLeft += ob.offsetLeft; | ||
+ | //ob.innerHTML += dTop+ ' '; | ||
+ | ob = ob.offsetParent;} | ||
+ | return dLeft; | ||
+ | } | ||
+ | |||
+ | |||
+ | function illus(object,name,text){ | ||
+ | var obj = document.getElementById("illus"); | ||
+ | obj.innerHTML = '<h2 style="color:white" >' + name + '</h2>'; | ||
+ | var coords = object.coords; | ||
+ | var left = coords.substring(0,coords.indexOf(',')); | ||
+ | coords = coords.substring(coords.indexOf(',')+1); | ||
+ | var top = coords.substring(0,coords.indexOf(',')); | ||
+ | coords = coords.substring(coords.indexOf(',')+1); | ||
+ | var width = coords.substring(0,coords.indexOf(',')) - left; | ||
+ | coords = coords.substring(coords.indexOf(',')+1); | ||
+ | obj.style.left = left + 'px'; | ||
+ | obj.style.marginTop = coords - 40 + 'px'; | ||
+ | obj.style.width = width -20 + 'px'; | ||
+ | obj.onmouseout = function(){obj.style.display = 'none'} | ||
+ | obj.onmouseover = function(){obj.style.display = 'block';} | ||
+ | obj.onmousedown = function(){window.location.assign(object.href);} | ||
+ | obj.style.height = 40 + 'px'; | ||
+ | obj.style.display = 'block'; | ||
+ | //alert(); | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | function hideillus(){ | ||
+ | var obj = document.getElementById("illus"); | ||
+ | obj.style.display = "none"; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </script> | ||
+ | </html> |
Latest revision as of 11:56, 2 October 2013