Galaxydud3 (Talk | contribs) |
|||
Line 171: | Line 171: | ||
<div id="big_header"> | <div id="big_header"> | ||
<img src="https://static.igem.org/mediawiki/2021/3/37/T--LINKS_China--bigheader_entreprenuership.jpg" style="position: absolute; top:15vw; left: 16vw; width: 68vw;"> | <img src="https://static.igem.org/mediawiki/2021/3/37/T--LINKS_China--bigheader_entreprenuership.jpg" style="position: absolute; top:15vw; left: 16vw; width: 68vw;"> | ||
− | <img src="https://static.igem.org/mediawiki/2021/ | + | <img src="https://static.igem.org/mediawiki/2021/f/fa/T--LINKS_China--descriptionplace_darkpurple.jpg" style="position: absolute; top:12vw; left: 22.5vw; width: 55vw;"> |
</div> | </div> | ||
Line 186: | Line 186: | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
Line 565: | Line 519: | ||
width: 100vw; | width: 100vw; | ||
height: 49vw; | height: 49vw; | ||
− | background: url(https://static.igem.org/mediawiki/2021/ | + | background: url(https://static.igem.org/mediawiki/2021/e/ec/T--LINKS_China--bigimg_entreprenuership.png); |
background-attachment:scroll; | background-attachment:scroll; | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
Line 604: | Line 558: | ||
@media only screen and (min-device-width: 768px) { | @media only screen and (min-device-width: 768px) { | ||
#sidebar_and_texts { | #sidebar_and_texts { | ||
− | |||
− | |||
− | |||
− | |||
} | } | ||
Line 706: | Line 656: | ||
@media only screen and (max-device-width: 768px) { | @media only screen and (max-device-width: 768px) { | ||
#sidebar_and_texts { | #sidebar_and_texts { | ||
− | |||
− | |||
− | |||
− | |||
} | } | ||
#sidebar { | #sidebar { | ||
− | display: | + | display: none; |
border: 0px solid #600136; | border: 0px solid #600136; | ||
} | } | ||
Line 754: | Line 700: | ||
.section-nav{ | .section-nav{ | ||
− | display: | + | display: none; |
background-color: #FFFFFF; | background-color: #FFFFFF; | ||
} | } | ||
Line 818: | Line 764: | ||
letter-spacing: 0.6px; | letter-spacing: 0.6px; | ||
text-shadow: 2px 2px 5px #C0C0C0; | text-shadow: 2px 2px 5px #C0C0C0; | ||
+ | margin-left: 4.5vw; | ||
+ | margin-right: 4.5vw; | ||
} | } | ||
Line 836: | Line 784: | ||
border-radius: 24px; | border-radius: 24px; | ||
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); | box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); | ||
− | margin-left: | + | margin-left: 4.5vw; |
− | margin-right: | + | margin-right: 4.5vw; |
} | } | ||
Line 945: | Line 893: | ||
border-radius: 24px; | border-radius: 24px; | ||
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); | box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); | ||
− | margin-left: | + | margin-left: 4.5vw; |
− | margin-right: | + | margin-right: 4.5vw; |
font-family: "LatoLight"; | font-family: "LatoLight"; | ||
} | } | ||
Line 961: | Line 909: | ||
font-family: "LatoLight"; | font-family: "LatoLight"; | ||
} | } | ||
+ | |||
+ | |||
+ | |||
+ | #show_on_click1, #show_on_click2, #show_on_click3, #show_on_click4, #show_on_click5{ | ||
+ | display:none; | ||
+ | transition: all 0.5s !important; | ||
+ | } | ||
+ | |||
+ | .show{ | ||
+ | display:block !important; | ||
+ | transition: all 0.5s !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | .show_buttons{ | ||
+ | color: grey; | ||
+ | font-family: "Lato"; | ||
+ | cursor: pointer; | ||
+ | border: none; | ||
+ | font-size: 1.5vw; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
Line 966: | Line 938: | ||
/*--------------------------------------MAIN BACKGROUND------------------------------------------*/ | /*--------------------------------------MAIN BACKGROUND------------------------------------------*/ | ||
#main_content{ | #main_content{ | ||
− | background-image: url(https://static.igem.org/mediawiki/2021/ | + | background-image: url(https://static.igem.org/mediawiki/2021/e/e8/T--LINKS_China--background_darkpurple.png); |
background-attachment:scroll; | background-attachment:scroll; | ||
background-repeat: repeat; | background-repeat: repeat; | ||
Line 1,125: | Line 1,097: | ||
z-index: 100; | z-index: 100; | ||
transition: top 0.3s; /* Transition effect when sliding down (and up) */ | transition: top 0.3s; /* Transition effect when sliding down (and up) */ | ||
+ | top:-100px; | ||
} | } | ||
Line 1,208: | Line 1,181: | ||
− | |||
<script> | <script> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
var prevScrollpos = window.pageYOffset; | var prevScrollpos = window.pageYOffset; | ||
window.onscroll = function() { | window.onscroll = function() { | ||
Line 1,274: | Line 1,187: | ||
if (prevScrollpos > currentScrollPos) { | if (prevScrollpos > currentScrollPos) { | ||
document.getElementById("outnav").style.top = "17px"; | document.getElementById("outnav").style.top = "17px"; | ||
− | |||
} else { | } else { | ||
document.getElementById("outnav").style.top = "-100px"; | document.getElementById("outnav").style.top = "-100px"; | ||
− | |||
} | } | ||
prevScrollpos = currentScrollPos; | prevScrollpos = currentScrollPos; | ||
Line 1,285: | Line 1,196: | ||
+ | function myFunction1() { | ||
+ | var element = document.getElementById("show_on_click1"); | ||
+ | element.classList.toggle("show"); | ||
+ | } | ||
+ | function myFunction2() { | ||
+ | var element = document.getElementById("show_on_click2"); | ||
+ | element.classList.toggle("show"); | ||
+ | } | ||
− | + | function myFunction3() { | |
+ | var element = document.getElementById("show_on_click3"); | ||
+ | element.classList.toggle("show"); | ||
+ | } | ||
− | + | function myFunction4() { | |
− | + | var element = document.getElementById("show_on_click4"); | |
− | + | element.classList.toggle("show"); | |
− | + | } | |
− | + | ||
− | + | function myFunction5() { | |
− | + | var element = document.getElementById("show_on_click5"); | |
− | + | element.classList.toggle("show"); | |
− | + | } | |
− | + | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</script> | </script> | ||
+ | |||
</html> | </html> |
Revision as of 00:25, 22 October 2021