Galaxydud3 (Talk | contribs) |
Galaxydud3 (Talk | contribs) |
||
Line 1: | Line 1: | ||
− | |||
− | |||
<html> | <html> | ||
+ | <!------------------------------------------Preloading----------------------------------------------> | ||
+ | <head> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/c/ce/T--LINKS_China--home_open_new.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/a/a1/T--LINKS_China--home_closed_new.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/5/53/T--LINKS_China--team_open_new_v2.jpg"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/9/92/T--LINKS_China--team_closed_new.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/9/99/T--LINKS_China--team_members_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/6/62/T--LINKS_China--team_attributions_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/2/21/T--LINKS_China--team_collaborations_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/4/4a/T--LINKS_China--team_partnership_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/2/21/T--LINKS_China--project_open_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/4/40/T--LINKS_China--project_closed_new.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/7/7d/T--LINKS_China--project_description_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/7/7b/T--LINKS_China--project_engineering_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/9/91/T--LINKS_China--project_implementation_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/7/76/T--LINKS_China--project_proofofconcept_new_v2.png"> | ||
− | < | + | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/4/49/T--LINKS_China--parts_open_new_v2.png"> |
− | < | + | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/1/16/T--LINKS_China--parts_closed_new.png"> |
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/1/1b/T--LINKS_China--parts_partslist_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/0/01/T--LINKS_China--parts_contribution_new_v2.png"> | ||
− | < | + | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/c/c1/T--LINKS_China--wetlab_open_new_v2.png"> |
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/3/39/T--LINKS_China--wetlab_closed_new.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/7/74/T--LINKS_China--wetlab_experiments_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/c/cc/T--LINKS_China--wetlab_measurement_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/b/b9/T--LINKS_China--wetlab_notebook_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/1/1f/T--LINKS_China--wetlab_results_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/6/6e/T--LINKS_China--wetlab_safety_new_v2.png"> | ||
− | < | + | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/6/6f/T--LINKS_China--drylab_open_new_v2.png"> |
− | < | + | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/6/6a/T--LINKS_China--drylab_closed_new.png"> |
− | + | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/4/46/T--LINKS_China--drylab_modeling_new_v2.png"> | |
− | < | + | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/8/8d/T--LINKS_China--drylab_hardware_new_v2.png"> |
− | + | ||
− | </ | + | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/7/79/T--LINKS_China--hps_open_new_v2.png"> |
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/e/e6/T--LINKS_China--hps_closed_new.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/0/0a/T--LINKS_China--hps_ihps_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/4/42/T--LINKS_China--hps_communication_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/b/b9/T--LINKS_China--hps_sustainability_new_v2.png"> | ||
+ | <link rel="preload" as="image" href="https://static.igem.org/mediawiki/2021/1/11/T--LINKS_China--hps_entreprenuership_new_v2.png"> | ||
+ | |||
+ | </head> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <!------------------------------------------NavStart----------------------------------------------> | ||
+ | <div id="outnav"> | ||
+ | |||
+ | |||
+ | |||
+ | <!---Home Spider ----> | ||
+ | <a href="https://2021.igem.org/Team:LINKS_China" class="dropbtn"><img src="https://static.igem.org/mediawiki/2021/3/33/T--LINKS_China--footer_teamlogo.png" id="homespider"></a> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <!---Seven Sections ----> | ||
+ | <div class="sections"> | ||
+ | |||
+ | |||
+ | <!---Home ----> | ||
+ | <div class="dropdown" onmouseover="home_main.src='https://static.igem.org/mediawiki/2021/c/ce/T--LINKS_China--home_open_new.png'" onmouseout="home_main.src='https://static.igem.org/mediawiki/2021/a/a1/T--LINKS_China--home_closed_new.png'"> | ||
+ | <a href="https://2021.igem.org/Team:LINKS_China"><img id="home_main" src="https://static.igem.org/mediawiki/2021/a/a1/T--LINKS_China--home_closed_new.png" class="dropbtn"></a> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <!---Team ----> | ||
+ | <div class="dropdown" onmouseover="team_main.src='https://static.igem.org/mediawiki/2021/5/53/T--LINKS_China--team_open_new_v2.jpg'" onmouseout="team_main.src='https://static.igem.org/mediawiki/2021/9/92/T--LINKS_China--team_closed_new.png'"> | ||
+ | <img id="team_main" src="https://static.igem.org/mediawiki/2021/9/92/T--LINKS_China--team_closed_new.png" class="dropbtn"> | ||
+ | <div class="dropdown-content"> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Members"><img src='https://static.igem.org/mediawiki/2021/9/99/T--LINKS_China--team_members_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Attributions"><img src='https://static.igem.org/mediawiki/2021/6/62/T--LINKS_China--team_attributions_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Collaborations"><img src='https://static.igem.org/mediawiki/2021/2/21/T--LINKS_China--team_collaborations_new_v2.png' class="dropbtn" ></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Partnership"><img src='https://static.igem.org/mediawiki/2021/4/4a/T--LINKS_China--team_partnership_new_v2.png' class="dropbtn" ></a></div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <!---Project ----> | ||
+ | <div class="dropdown" onmouseover="project_main.src='https://static.igem.org/mediawiki/2021/2/21/T--LINKS_China--project_open_new_v2.png'" onmouseout="project_main.src='https://static.igem.org/mediawiki/2021/4/40/T--LINKS_China--project_closed_new.png'"> | ||
+ | <img id="project_main" src="https://static.igem.org/mediawiki/2021/4/40/T--LINKS_China--project_closed_new.png" class="dropbtn"> | ||
+ | <div class="dropdown-content"> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Description"><img src='https://static.igem.org/mediawiki/2021/7/7d/T--LINKS_China--project_description_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Engineering"><img src='https://static.igem.org/mediawiki/2021/7/7b/T--LINKS_China--project_engineering_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Implementation"><img src='https://static.igem.org/mediawiki/2021/9/91/T--LINKS_China--project_implementation_new_v2.png' class="dropbtn" ></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Proof_Of_Concept"><img src='https://static.igem.org/mediawiki/2021/7/76/T--LINKS_China--project_proofofconcept_new_v2.png' class="dropbtn" ></a></div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <!---Parts ----> | ||
+ | |||
+ | <div class="dropdown" onmouseover="parts_main.src='https://static.igem.org/mediawiki/2021/4/49/T--LINKS_China--parts_open_new_v2.png'" onmouseout="parts_main.src='https://static.igem.org/mediawiki/2021/1/16/T--LINKS_China--parts_closed_new.png'"> | ||
+ | <img id="parts_main" src="https://static.igem.org/mediawiki/2021/1/16/T--LINKS_China--parts_closed_new.png" class="dropbtn"> | ||
+ | <div class="dropdown-content"> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Parts_List"><img src='https://static.igem.org/mediawiki/2021/1/1b/T--LINKS_China--parts_partslist_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Contribution"><img src='https://static.igem.org/mediawiki/2021/0/01/T--LINKS_China--parts_contribution_new_v2.png' class="dropbtn"></a></div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <!---Wet Lab ----> | ||
+ | <div class="dropdown" onmouseover="wetlab_main.src='https://static.igem.org/mediawiki/2021/c/c1/T--LINKS_China--wetlab_open_new_v2.png'" onmouseout="wetlab_main.src='https://static.igem.org/mediawiki/2021/3/39/T--LINKS_China--wetlab_closed_new.png'"> | ||
+ | <img id="wetlab_main" src="https://static.igem.org/mediawiki/2021/3/39/T--LINKS_China--wetlab_closed_new.png" class="dropbtn"> | ||
+ | <div class="dropdown-content"> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Experiments"><img src='https://static.igem.org/mediawiki/2021/7/74/T--LINKS_China--wetlab_experiments_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Measurement"><img src='https://static.igem.org/mediawiki/2021/c/cc/T--LINKS_China--wetlab_measurement_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Notebook"><img src='https://static.igem.org/mediawiki/2021/b/b9/T--LINKS_China--wetlab_notebook_new_v2.png' class="dropbtn" ></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Results"><img src='https://static.igem.org/mediawiki/2021/1/1f/T--LINKS_China--wetlab_results_new_v2.png' class="dropbtn" ></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Safety"><img src='https://static.igem.org/mediawiki/2021/6/6e/T--LINKS_China--wetlab_safety_new_v2.png' class="dropbtn" ></a></div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <!---Dry Lab ----> | ||
+ | <div class="dropdown" onmouseover="drylab_main.src='https://static.igem.org/mediawiki/2021/6/6f/T--LINKS_China--drylab_open_new_v2.png'" onmouseout="drylab_main.src='https://static.igem.org/mediawiki/2021/6/6a/T--LINKS_China--drylab_closed_new.png'"> | ||
+ | <img id="drylab_main" src="https://static.igem.org/mediawiki/2021/6/6a/T--LINKS_China--drylab_closed_new.png" class="dropbtn"> | ||
+ | <div class="dropdown-content"> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Model"><img src='https://static.igem.org/mediawiki/2021/4/46/T--LINKS_China--drylab_modeling_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Hardware"><img src='https://static.igem.org/mediawiki/2021/8/8d/T--LINKS_China--drylab_hardware_new_v2.png' class="dropbtn"></a></div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <!---HPs----> | ||
+ | <div class="dropdown" onmouseover="hps_main.src='https://static.igem.org/mediawiki/2021/7/79/T--LINKS_China--hps_open_new_v2.png'" onmouseout="hps_main.src='https://static.igem.org/mediawiki/2021/e/e6/T--LINKS_China--hps_closed_new.png'"> | ||
+ | <img id="hps_main" src="https://static.igem.org/mediawiki/2021/e/e6/T--LINKS_China--hps_closed_new.png" class="dropbtn"> | ||
+ | <div class="dropdown-content"> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Human_Practices"><img src='https://static.igem.org/mediawiki/2021/0/0a/T--LINKS_China--hps_ihps_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Communication"><img src='https://static.igem.org/mediawiki/2021/4/42/T--LINKS_China--hps_communication_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Sustainable"><img src='https://static.igem.org/mediawiki/2021/b/b9/T--LINKS_China--hps_sustainability_new_v2.png' class="dropbtn"></a></div> | ||
+ | <div><a href="https://2021.igem.org/Team:LINKS_China/Entrepreneurship"><img src='https://static.igem.org/mediawiki/2021/1/11/T--LINKS_China--hps_entreprenuership_new_v2.png' class="dropbtn"></a></div> | ||
+ | </div> | ||
+ | </div> | ||
</div> | </div> | ||
+ | </div> | ||
+ | <!------------------------------------------------NavEnd-------------------------------------------------> | ||
+ | |||
+ | |||
+ | <div id="big_header"> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/1/14/T--LINKS_China--bigheader_communication.jpg" style="position: absolute; top:13.5vw; left: 23vw; width: 54vw;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/0/0f/T--LINKS_China--descriptionplace_lightpurple.jpg" style="position: absolute; top:12vw; left: 22.5vw; width: 55vw;"> | ||
+ | </div> | ||
+ | |||
+ | <div id="main_content"> | ||
+ | <!------------- | ||
+ | <div id="horizontal_zipper_header"> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/7/72/T--LINKS_China--horizontal_zipper2.0.jpg"><img src="https://static.igem.org/mediawiki/2021/7/72/T--LINKS_China--horizontal_zipper2.0.jpg"> | ||
+ | </div>---------> | ||
+ | |||
+ | |||
+ | |||
+ | <!------------------------------------SIDEBAR_AND_TEXT-------------------------------------> | ||
+ | <div id="sidebar_and_texts"> | ||
+ | |||
+ | |||
+ | <!------------------------------------SIDEBAR_START-------------------------------------> | ||
+ | <div id="sidebar"> | ||
+ | |||
+ | <ul class="section_guider" style="list-style: none !important;"> | ||
+ | <li><a href="#section1"><img src="https://static.igem.org/mediawiki/2021/b/b4/T--LINKS_China--sectionguider_test1.2.jpg" id="section1_guider"></a></li> | ||
+ | <li><a href="#section2"><img src="https://static.igem.org/mediawiki/2021/8/80/T--LINKS_China--sectionguider_test2.2.jpg | ||
+ | " id="section2_guider"></a></li> | ||
+ | <li><a href="#section3"><img src="https://static.igem.org/mediawiki/2021/3/35/T--LINKS_China--sectionguider_test3.2.jpg" id="section3_guider"></a></li> | ||
+ | <li><a href="#section4"><img src="https://static.igem.org/mediawiki/2021/b/b9/T--LINKS_China--section_guidertest4.1.jpg" id="section4_guider"></a></li> | ||
+ | <li><a href="#section5"><img src="https://static.igem.org/mediawiki/2021/a/aa/T--LINKS_China--section_guidertest5.1.jpg" id="section5_guider"></a></li> | ||
+ | <li><a href="#section6"><img src="https://static.igem.org/mediawiki/2021/4/41/T--LINKS_China--section_guidertest6.1.jpg" id="section6_guider"></a></li> | ||
+ | <li><a href="#"><img src="https://static.igem.org/mediawiki/2021/0/03/T--LINKS_China--section_guidertest7.2.jpg" id="section7_guider"></a></li> | ||
+ | <li><a href="#"><img src="https://static.igem.org/mediawiki/2021/c/cb/T--LINKS_China--section_guidertest8.1.jpg" id="section8_guider"></a></li> | ||
+ | </ul> | ||
+ | |||
+ | |||
+ | |||
+ | <ul class="section_header" style="list-style: none !important;"> | ||
+ | <li><img src="https://static.igem.org/mediawiki/2021/c/c3/T--LINKS_China--section_header_purple.jpg" id="section1_header"></li> | ||
+ | <li><img src="https://static.igem.org/mediawiki/2021/c/c3/T--LINKS_China--section_header_purple.jpg" id="section2_header"></li> | ||
+ | <li><img src="https://static.igem.org/mediawiki/2021/c/c3/T--LINKS_China--section_header_purple.jpg" id="section3_header"></li> | ||
+ | <li><img src="https://static.igem.org/mediawiki/2021/c/c3/T--LINKS_China--section_header_purple.jpg" id="section4_header"></li> | ||
+ | <li><img src="https://static.igem.org/mediawiki/2021/c/c3/T--LINKS_China--section_header_purple.jpg" id="section5_header"></li> | ||
+ | <li><img src="https://static.igem.org/mediawiki/2021/c/c3/T--LINKS_China--section_header_purple.jpg" id="section6_header"></li> | ||
+ | <li><img src="https://static.igem.org/mediawiki/2021/c/c3/T--LINKS_China--section_header_purple.jpg" id="section7_header"></li> | ||
+ | <li><img src="https://static.igem.org/mediawiki/2021/c/c3/T--LINKS_China--section_header_purple.jpg" id="section8_header"></li> | ||
+ | </ul> | ||
+ | |||
+ | <a id="top_button" href="#"><img src="https://static.igem.org/mediawiki/2021/8/8e/T--LINKS_China--top_button.jpg"></a> | ||
+ | |||
+ | |||
+ | <nav class="section-nav"> | ||
+ | <ul> | ||
+ | <li><a href="#section1">Overview</a></li> | ||
+ | <li><a href="#section2">Producing Bacterial Cellulose</a></li> | ||
+ | <li><a href="#section3">Spider Silk modification of BC’s properties</a></li> | ||
+ | <li><a href="#section4">Dyeing BC with Natural Dyes</a></li> | ||
+ | <li><a href="#section5">Producing ethyl acetate from the byproducts of fermentation</a></li> | ||
+ | <li><a href="#section6">References</a></li> | ||
+ | <li><a href="#section7"></a></li> | ||
+ | <li><a href="#section8"></a></li> | ||
+ | </ul> | ||
+ | </nav> | ||
+ | |||
+ | </div> | ||
+ | <!------------------------------------SIDEBAR_END-------------------------------------> | ||
+ | |||
+ | |||
+ | <!------------------------------------TEXT_START-------------------------------------> | ||
+ | |||
+ | <div id="texts"> | ||
+ | <h1></h1> | ||
+ | <br> | ||
+ | |||
+ | <section class="normal_texts" id="section1"> | ||
+ | <br> | ||
+ | <br> | ||
+ | </section> | ||
+ | |||
+ | |||
+ | <br><br><br> | ||
+ | |||
+ | <h1></h1> | ||
+ | <section class="normal_texts" id="section2"> | ||
+ | <br> | ||
+ | <br> | ||
+ | </section> | ||
+ | |||
+ | <br><br><br> | ||
+ | |||
+ | |||
+ | <h1></h1> | ||
+ | <section class="normal_texts" id="section3"> | ||
+ | <br> | ||
+ | <br> | ||
+ | </section> | ||
+ | |||
+ | <br><br><br> | ||
+ | |||
+ | |||
+ | <h1></h1> | ||
+ | <section class="normal_texts" id="section4"> | ||
+ | <br> | ||
+ | <br> | ||
+ | </section> | ||
+ | |||
+ | <br><br><br> | ||
+ | |||
+ | |||
+ | <h1></h1> | ||
+ | <section class="normal_texts" id="section5"> | ||
+ | <br> | ||
+ | <br> | ||
+ | </section> | ||
+ | <br><br><br> | ||
+ | <h1></h1> | ||
+ | <section class="normal_texts" id="section6"> | ||
+ | <br> | ||
+ | <br> | ||
+ | </section> | ||
+ | |||
+ | <br><br><br> | ||
+ | |||
+ | <h1></h1> | ||
+ | <section class="normal_texts" id="section7"> | ||
+ | <br> | ||
+ | <br> | ||
+ | </section> | ||
+ | |||
+ | <br><br><br> | ||
+ | |||
+ | |||
+ | |||
+ | <h1>References</h1> | ||
+ | <section class="references" id="section8"> | ||
+ | <br> | ||
+ | <ol> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | </ol> | ||
+ | <br> | ||
+ | </section> | ||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | <br><br><br> | ||
+ | <!------------------------------------TEXT_END-------------------------------------> | ||
+ | |||
+ | <div id="footer"> | ||
+ | <div id="links-logo"> | ||
+ | <a href="https://2021.igem.org/Team:LINKS_China"><img src="https://static.igem.org/mediawiki/2021/3/33/T--LINKS_China--footer_teamlogo.png" height="100" width="auto"></a> | ||
+ | </div> | ||
+ | <div id="footer-divider"> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/0/0d/T--LINKS_China--black_vertical_footer_divider2.png" height="125" width="2"> | ||
+ | </div> | ||
+ | <div id="footer-text"> | ||
+ | <h3>Sponsors</h3> | ||
+ | </div> | ||
+ | <div id="snapgene-logo"> | ||
+ | <a href="https://www.snapgene.com/"><img src="https://static.igem.org/mediawiki/2021/5/5e/T--LINKS_China--SnapGeneLogo.jpg"></a> | ||
+ | </div> | ||
+ | <div id="linkspider-logo"> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/3/38/T--LINKS_China--linkspider_logo.png" height="100" width="auto"> | ||
+ | </div> | ||
+ | <div id="basis-logo"> | ||
+ | <a href="https://basis-global.com/"><img src="https://static.igem.org/mediawiki/2021/7/7d/T--LINKS_China--basis_logo.png" height="100" width="auto"></a> | ||
+ | </div> | ||
+ | <div id="scie-logo"> | ||
+ | <a href="https://www.scie.com.cn/"><img src="https://static.igem.org/mediawiki/2021/e/ec/T--LINKS_China--scie_logo.png" height="100" width="auto"></a> | ||
+ | </div> | ||
+ | <div id="footer-divider2"> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/0/0d/T--LINKS_China--black_vertical_footer_divider2.png" height="125" width="2"> | ||
+ | </div> | ||
+ | <div id="footer-text2"> | ||
+ | <h3>Follow Us</h3> | ||
+ | </div> | ||
+ | <div id="ins-logo"> | ||
+ | <a href="https://www.instagram.com/links_china/"><img src="https://static.igem.org/mediawiki/2021/0/07/T--LINKS_China--ins_logo_tp.png" height="90" width="auto"></a> | ||
+ | </div> | ||
+ | <div id="bilibili-logo"> | ||
+ | <a href="https://space.bilibili.com/71190254?from=search&seid=7679001301054558817&spm_id_from=333.337.0.0"><img src="https://static.igem.org/mediawiki/2021/0/01/T--LINKS_China--bilibili_logo_tp.png" height="60" width="auto"></a> | ||
+ | </div> | ||
+ | <div id="email-logo"> | ||
+ | <a href="mailto: links_china@outlook.com"><img src="https://static.igem.org/mediawiki/2021/d/df/T--LINKS_China--email_logo.png" height="90" width="auto"></a> | ||
+ | </div> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/a/aa/T--LINKS_China--footer4.png" class="footer"> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <style> | ||
+ | html { | ||
+ | scroll-behavior: smooth; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*----------------------------------------FONTS--------------------------------------------*/ | ||
+ | @font-face{ | ||
+ | font-family: "Jost" ; | ||
+ | src: url("https://static.igem.org/mediawiki/2021/6/65/T--LINKS_China--fonts_jost.ttf"); | ||
+ | } | ||
+ | |||
+ | |||
+ | @font-face{ | ||
+ | font-family: "Roboto"; | ||
+ | src: url("https://static.igem.org/mediawiki/2021/6/66/T--LINKS_China--fonts_roboto_regular.ttf"); | ||
+ | } | ||
+ | |||
+ | @font-face{ | ||
+ | font-family: "Lato"; | ||
+ | src: url("https://static.igem.org/mediawiki/2021/d/d2/T--LINKS_China--fonts_lato_regular.ttf"); | ||
+ | } | ||
+ | |||
+ | |||
+ | @font-face{ | ||
+ | font-family: "Open Sans"; | ||
+ | src: url("https://static.igem.org/mediawiki/2021/5/5e/T--LINKS_China--fonts_opensans.ttf"); | ||
+ | } | ||
+ | |||
+ | @font-face{ | ||
+ | font-family: "LatoLight"; | ||
+ | src: url("https://static.igem.org/mediawiki/2021/f/f9/T--LINKS_China--fonts_Latolight.ttf") | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /*--------------------------------------BIG HEADER AND HORIZONTAL ZIPPER------------------------------------------*/ | ||
+ | #big_header{ | ||
+ | width: 100vw; | ||
+ | height: 49vw; | ||
+ | background: url(https://static.igem.org/mediawiki/2021/4/43/T--LINKS_China--backgroundimg_results.jpg); | ||
+ | background-attachment:scroll; | ||
+ | background-repeat: no-repeat; | ||
+ | background-position:top; | ||
+ | background-size: 105%; | ||
+ | padding: 0; | ||
+ | box-shadow: 0 0 0.4vw 0.4vw #fbedf3 inset; | ||
+ | } | ||
+ | |||
+ | #big_header img{ | ||
+ | width: 100vw; | ||
+ | height: auto; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | |||
+ | #horizontal_zipper_header{ | ||
+ | display: flex; | ||
+ | } | ||
+ | |||
+ | #horizontal_zipper_header img{ | ||
+ | flex: 50%; | ||
+ | width: 48vw; | ||
+ | height: 1vw; | ||
+ | padding: 2vw; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /*--------------------------------------SIDEBAR FOR COMPUTERS------------------------------------------*/ | ||
+ | |||
+ | @media only screen and (min-device-width: 768px) { | ||
+ | #sidebar_and_texts { | ||
+ | display: grid; | ||
+ | grid-template-columns: 0.27fr 1.63fr; | ||
+ | gap: 0px 0px; | ||
+ | align-items: baseline; | ||
+ | } | ||
+ | |||
+ | #sidebar { | ||
+ | position: sticky; | ||
+ | top: 5vw; | ||
+ | left: 3vw; | ||
+ | margin: 0; | ||
+ | font-size: 2.25em; | ||
+ | line-height: 1.2; | ||
+ | height: 34vw; | ||
+ | width: 3.9vw; | ||
+ | border: 3.3px solid #600136; | ||
+ | border-radius: 1.25vw; | ||
+ | background-attachment:scroll; | ||
+ | background-repeat: no-repeat; | ||
+ | background-position:top; | ||
+ | background-size: 100%; | ||
+ | transition: top 0.3s; /* Transition effect when sliding down (and up) */ | ||
+ | } | ||
+ | |||
+ | #sidebar .section_guider{ | ||
+ | position: absolute; | ||
+ | z-index: 2; | ||
+ | list-style: none !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | #sidebar .section_guider li{ | ||
+ | z-index: 2; | ||
+ | list-style: none !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | #sidebar .section_guider img{ | ||
+ | width: 2.56vw; | ||
+ | top: 4px; | ||
+ | margin: 0vw 0vw 0vw 0vw; | ||
+ | right: 36.7px; | ||
+ | height: auto; | ||
+ | z-index: 2; | ||
+ | list-style: none !important; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | #sidebar .section_header li{ | ||
+ | z-index: 2; | ||
+ | list-style: none !important; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | #sidebar .section_header{ | ||
+ | position: relative; | ||
+ | z-index: 2; | ||
+ | list-style: none !important; | ||
+ | } | ||
+ | |||
+ | #sidebar .section_header img{ | ||
+ | position: relative; | ||
+ | width: 11.2vw; | ||
+ | top: -1.3vw; | ||
+ | padding: 1.75vw 0vw 0vw 0vw; | ||
+ | right: 0.55vw; | ||
+ | height: auto; | ||
+ | z-index: 2; | ||
+ | list-style: none !important; | ||
+ | position: relative; | ||
+ | opacity: 0; | ||
+ | float: initial; | ||
+ | } | ||
+ | |||
+ | #sidebar #top_button img{ | ||
+ | position: relative; | ||
+ | width: 5vw; | ||
+ | top: 0.5vw; | ||
+ | left: -0.525vw; | ||
+ | } | ||
+ | |||
+ | .section-nav{ | ||
+ | display: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /*--------------------------------------SIDEBAR FOR IPADS AND PHONES------------------------------------------*/ | ||
+ | |||
+ | |||
+ | @media only screen and (max-device-width: 768px) { | ||
+ | #sidebar_and_texts { | ||
+ | display: grid; | ||
+ | grid-template-columns: 0.31fr 1.59fr; | ||
+ | gap: 0px 0px; | ||
+ | align-items: baseline; | ||
+ | } | ||
+ | |||
+ | #sidebar { | ||
+ | display: block; | ||
+ | border: 0px solid #600136; | ||
+ | } | ||
+ | |||
+ | |||
+ | #sidebar .section_guider{ | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | #sidebar .section_guider li{ | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | #sidebar .section_guider img{ | ||
+ | display: none | ||
+ | } | ||
+ | |||
+ | |||
+ | #sidebar .section_header{ | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | #sidebar .section_header li{ | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | #sidebar .section_header img{ | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | #sidebar #top_button img{ | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | .section-nav{ | ||
+ | display: block; | ||
+ | background-color: #FFFFFF; | ||
+ | } | ||
+ | .section-nav li.active > a { | ||
+ | color: #630330; | ||
+ | font-weight: 1200; | ||
+ | } | ||
+ | |||
+ | /* Sidebar Navigation */ | ||
+ | .section-nav { | ||
+ | padding-left: 0; | ||
+ | border: 3px solid #efefef; | ||
+ | color: white; | ||
+ | width: 11vw; | ||
+ | height: 30vw; | ||
+ | font-size: 9pt; | ||
+ | border-radius: 17px; | ||
+ | } | ||
+ | |||
+ | .section-nav li { | ||
+ | list-style: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | .section-nav li a { | ||
+ | text-decoration: none; | ||
+ | display: block; | ||
+ | padding: .125rem 0; | ||
+ | color: #ccc; | ||
+ | transition: all 50ms ease-in-out; | ||
+ | right: 3vw; | ||
+ | } | ||
+ | |||
+ | |||
+ | .section-nav a:hover, | ||
+ | .section-nav a:focus { | ||
+ | color: #630330; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /*--------------------------------------MAIN TEXTS------------------------------------------*/ | ||
+ | #texts{ | ||
+ | position: relative; | ||
+ | top: 0vw; | ||
+ | padding: 3vw; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | |||
+ | #texts h1{ | ||
+ | font-size: 5em; | ||
+ | color: #630330; | ||
+ | font-family: 'Open Sans'; | ||
+ | z-index: 5; | ||
+ | font-weight: bolder; | ||
+ | line-height: 1.2; | ||
+ | letter-spacing: 0.6px; | ||
+ | text-shadow: 2px 2px 5px #C0C0C0; | ||
+ | } | ||
+ | |||
+ | |||
+ | #texts .normal_texts h2{ | ||
+ | font-size: 20pt; | ||
+ | font-weight: 520; | ||
+ | font-family: "Open Sans"; | ||
+ | margin-left: 2.4vw; | ||
+ | margin-right: 2.4vw; | ||
+ | line-height: 2.3vw; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | #texts .normal_texts{ | ||
+ | background: white; | ||
+ | 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); | ||
+ | margin-left: 0.3vw; | ||
+ | margin-right: 3vw; | ||
+ | } | ||
+ | |||
+ | |||
+ | #texts .normal_texts p{ | ||
+ | margin: 1.6vw 2.5vw; | ||
+ | font-size: 1.5em; | ||
+ | font-weight: 300; | ||
+ | font-family: "LatoLight"; | ||
+ | } | ||
+ | |||
+ | |||
+ | #texts .normal_texts ol{ | ||
+ | margin: 1.4vw 4.5vw; | ||
+ | font-size: 1.5em; | ||
+ | font-weight: 300; | ||
+ | font-family: "LatoLight"; | ||
+ | } | ||
+ | |||
+ | #texts .normal_texts li{ | ||
+ | margin: 0.7vw; | ||
+ | font-weight: 300; | ||
+ | font-family: "LatoLight"; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | #texts .funfacts{ | ||
+ | background-image:url(https://static.igem.org/mediawiki/2021/d/de/T--LINKS_China--funfacts_bubblev2.jpg); | ||
+ | width: 55vw; | ||
+ | height: 30vw; | ||
+ | margin-left: 7vw; | ||
+ | background-attachment:scroll; | ||
+ | background-repeat: no-repeat; | ||
+ | background-position:top; | ||
+ | background-size: 100%; | ||
+ | |||
+ | } | ||
+ | |||
+ | #texts .funfacts p{ | ||
+ | position: relative; | ||
+ | top: 12.5vw; | ||
+ | margin-left: 8.7vw; | ||
+ | margin-right: 24vw; | ||
+ | margin-bottom: 0; | ||
+ | } | ||
+ | |||
+ | |||
+ | #texts .horizontal_zipper_texts{ | ||
+ | width: 65vw; | ||
+ | height: auto; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /*--------------------------------------IMAGES AND EXPLANATIONS------------------------------------------*/ | ||
+ | |||
+ | .picture_and_explanation{ | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | .picture_and_explanation img{ | ||
+ | max-width: 60vw; | ||
+ | height: auto; | ||
+ | } | ||
+ | |||
+ | .picture_and_explanation p{ | ||
+ | font-size: 1.1em !important; | ||
+ | font-family: Arial; | ||
+ | color: grey; | ||
+ | text-align: center; | ||
+ | margin-left: 5vw !important; | ||
+ | margin-right: 5vw !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /*--------------------------------------SIDENOTES------------------------------------------*/ | ||
+ | |||
+ | #side_notes { | ||
+ | background: #dcdcdc; | ||
+ | margin: 1vw 5vw; | ||
+ | } | ||
+ | |||
+ | #side_notes h2{ | ||
+ | font-size: 20pt; | ||
+ | font-weight: 650; | ||
+ | font-family: "Open Sans"; | ||
+ | padding: 2.1vw 1.5vw 0 1.5vw; | ||
+ | } | ||
+ | |||
+ | #side_notes p{ | ||
+ | padding: 0 1.5vw 2.1vw 1.5vw; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /*--------------------------------------REFERENCES------------------------------------------*/ | ||
+ | |||
+ | |||
+ | #texts .references{ | ||
+ | background: white; | ||
+ | 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); | ||
+ | margin-left: 0.3vw; | ||
+ | margin-right: 3vw; | ||
+ | font-family: "LatoLight"; | ||
+ | } | ||
+ | |||
+ | |||
+ | #texts .references ol{ | ||
+ | margin: 2vw 2.5vw; | ||
+ | font-size: 1em; | ||
+ | font-family: "LatoLight"; | ||
+ | } | ||
+ | |||
+ | #texts .references li{ | ||
+ | margin: 1vw; | ||
+ | font-family: "LatoLight"; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /*--------------------------------------MAIN BACKGROUND------------------------------------------*/ | ||
+ | #main_content{ | ||
+ | background-image: url(https://static.igem.org/mediawiki/2021/2/22/T--LINKS_China--background_lightpurple.png); | ||
+ | background-attachment:scroll; | ||
+ | background-repeat: repeat; | ||
+ | background-position:top; | ||
+ | background-size: 100%; | ||
+ | width: auto; | ||
+ | height: auto; | ||
+ | background-blend-mode: lighten; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /*--------------------------------------FOOTER------------------------------------------*/ | ||
+ | |||
+ | |||
+ | #footer{ | ||
+ | background-image: url("https://static.igem.org/mediawiki/2021/0/0a/T--LINKS_China--footer_test1.png"); | ||
+ | } | ||
+ | |||
+ | .banner { | ||
+ | align: center; | ||
+ | height: auto; | ||
+ | width: 100vw; | ||
+ | margin-bottom: 0px; | ||
+ | padding-bottom: 0px; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | .footer { | ||
+ | align: center; | ||
+ | width: 100vw; | ||
+ | height: auto; | ||
+ | margin-bottom: 0px; | ||
+ | padding-bottom: 0px; | ||
+ | } | ||
+ | |||
+ | |||
+ | .footer img{ | ||
+ | height: 3vw !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | #links-logo { | ||
+ | position: absolute; | ||
+ | bottom: 4.17vw; | ||
+ | left: 10.4vw; | ||
+ | } | ||
+ | |||
+ | #snapgene-logo { | ||
+ | position: absolute; | ||
+ | bottom: 4.86vw; | ||
+ | left: 20.83vw; | ||
+ | } | ||
+ | |||
+ | |||
+ | #footer-divider { | ||
+ | position: absolute; | ||
+ | bottom: 3.82vw; | ||
+ | left: 18.75vw; | ||
+ | } | ||
+ | |||
+ | h3 { | ||
+ | font-size: 200%; | ||
+ | color: #66023c; | ||
+ | } | ||
+ | |||
+ | #footer-text { | ||
+ | position: absolute; | ||
+ | bottom: 11.111vw; | ||
+ | left: 20.139vw; | ||
+ | } | ||
+ | |||
+ | #linkspider-logo { | ||
+ | position: absolute; | ||
+ | bottom: 4.1667vw; | ||
+ | left: 43.4vw; | ||
+ | } | ||
+ | |||
+ | #basis-logo { | ||
+ | position: absolute; | ||
+ | bottom: 4.514vw; | ||
+ | left: 51.389vw; | ||
+ | } | ||
+ | |||
+ | #scie-logo { | ||
+ | position: absolute; | ||
+ | bottom: 4.5139vw; | ||
+ | left: 60.07vw; | ||
+ | } | ||
+ | |||
+ | #footer-divider2 { | ||
+ | position: absolute; | ||
+ | bottom: 3.819vw; | ||
+ | left: 68.4vw; | ||
+ | } | ||
+ | |||
+ | #footer-text2 { | ||
+ | position: absolute; | ||
+ | bottom: 11.11111vw; | ||
+ | left: 69.79vw; | ||
+ | } | ||
+ | |||
+ | #ins-logo { | ||
+ | position: absolute; | ||
+ | bottom: 4.51389vw; | ||
+ | left: 69.4444vw; | ||
+ | } | ||
+ | |||
+ | #bilibili-logo { | ||
+ | position: absolute; | ||
+ | bottom: 5.5555556vw; | ||
+ | left: 77.08vw; | ||
+ | } | ||
+ | |||
+ | #email-logo { | ||
+ | position: absolute; | ||
+ | bottom: 4.5139vw; | ||
+ | left: 87.847vw; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /*-----------------------------------------NAV_BAR_START-----------------------------------------------*/ | ||
+ | |||
+ | |||
+ | /* CLEAR DEFAULT SETTINGS **************************************************/ | ||
+ | #sideMenu, #top_title, .patrollink, #firstHeading, #home_logo, #sideMenu { display:none; } | ||
+ | #content { padding:0px; width:100%; margin-top:-7px; margin-left:0px; border:none;} | ||
+ | body, html {background-color:white; width: 100%; height: 100%;} | ||
+ | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } | ||
+ | |||
+ | #bodyContent a[href ^="https://"], .link-https { padding-right:0px;} | ||
+ | |||
+ | /*Navigation Bar*/. | ||
+ | * { | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* Navbar container */ | ||
+ | #outnav { | ||
+ | overflow: visible; | ||
+ | zoom:1.0; | ||
+ | font-family: Arial; | ||
+ | position: fixed; | ||
+ | display: float; | ||
+ | z-index: 100; | ||
+ | transition: top 0.3s; /* Transition effect when sliding down (and up) */ | ||
+ | } | ||
+ | |||
+ | #outnav:after{ | ||
+ | content:" "; | ||
+ | display: block; | ||
+ | clear: both; | ||
+ | height: 0; | ||
+ | visibility: hidden; | ||
+ | display: float; | ||
+ | } | ||
+ | |||
+ | |||
+ | #outnav img{ | ||
+ | max-width: 100%; | ||
+ | } | ||
+ | |||
+ | #homespider{ | ||
+ | width: 7.7vw; | ||
+ | height: auto; | ||
+ | position: relative; | ||
+ | left: 1vw; | ||
+ | } | ||
+ | |||
+ | /* Six sections */ | ||
+ | .sections{ | ||
+ | display: flex; | ||
+ | column-gap: 0.4vw; | ||
+ | justify-content: space-between; | ||
+ | position: relative; | ||
+ | left: 2.8vw; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /* Links (including logo) inside the navbar */ | ||
+ | #outnav a{ | ||
+ | float: left; | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* Dropdown container */ | ||
+ | .dropdown { | ||
+ | overflow: hidden; | ||
+ | float: left; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /* Dropdown button */ | ||
+ | .dropdown .dropbtn { | ||
+ | width: 12.4vw; | ||
+ | height: auto; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /* Dropdown content (hidden by default) */ | ||
+ | .dropdown-content { | ||
+ | display: none; | ||
+ | position: absolute; | ||
+ | object-fit:cover; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /* Show dropdown content on hover */ | ||
+ | .dropdown:hover .dropdown-content { | ||
+ | display: block; | ||
+ | object-fit:cover; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | #globalWrapper{ | ||
+ | padding-bottom: 0px !important; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | <!----------------------------SIDEBAR_EFFECT---------------------------> | ||
+ | <script> | ||
+ | $(document).ready( function() { | ||
+ | |||
+ | $("#section1_guider").hover( function() { | ||
+ | $("#section1_header").animate({opacity: 1}, 350); | ||
+ | }, function() { | ||
+ | $("#section1_header").animate({opacity: 0}, 150); | ||
+ | }); | ||
+ | |||
+ | |||
+ | $("#section2_guider").hover( function() { | ||
+ | $("#section2_header").animate({opacity: 1}, 350); | ||
+ | }, function() { | ||
+ | $("#section2_header").animate({opacity: 0}, 150); | ||
+ | }); | ||
+ | |||
+ | |||
+ | |||
+ | $("#section3_guider").hover( function() { | ||
+ | $("#section3_header").animate({opacity: 1}, 350); | ||
+ | }, function() { | ||
+ | $("#section3_header").animate({opacity: 0}, 150); | ||
+ | }); | ||
+ | |||
+ | |||
+ | $("#section4_guider").hover( function() { | ||
+ | $("#section4_header").animate({opacity: 1}, 350); | ||
+ | }, function() { | ||
+ | $("#section4_header").animate({opacity: 0}, 150); | ||
+ | }); | ||
+ | |||
+ | $("#section5_guider").hover( function() { | ||
+ | $("#section5_header").animate({opacity: 1}, 350); | ||
+ | }, function() { | ||
+ | $("#section5_header").animate({opacity: 0}, 150); | ||
+ | }); | ||
+ | |||
+ | $("#section6_guider").hover( function() { | ||
+ | $("#section6_header").animate({opacity: 1}, 350); | ||
+ | }, function() { | ||
+ | $("#section6_header").animate({opacity: 0}, 150); | ||
+ | }); | ||
+ | |||
+ | $("#section7_guider").hover( function() { | ||
+ | $("#section7_header").animate({opacity: 1}, 350); | ||
+ | }, function() { | ||
+ | $("#section7_header").animate({opacity: 0}, 150); | ||
+ | }); | ||
+ | $("#section8_guider").hover( function() { | ||
+ | $("#section8_header").animate({opacity: 1}, 350); | ||
+ | }, function() { | ||
+ | $("#section8_header").animate({opacity: 0}, 150); | ||
+ | }); | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | }); | ||
+ | |||
+ | <!----------------------------NAVBAR_EFFECT---------------------------> | ||
+ | var prevScrollpos = window.pageYOffset; | ||
+ | window.onscroll = function() { | ||
+ | var currentScrollPos = window.pageYOffset; | ||
+ | if (prevScrollpos > currentScrollPos) { | ||
+ | document.getElementById("outnav").style.top = "17px"; | ||
+ | document.getElementById("sidebar").style.top = "9.7vw"; | ||
+ | } else { | ||
+ | document.getElementById("outnav").style.top = "-100px"; | ||
+ | document.getElementById("sidebar").style.top = "5vw"; | ||
+ | } | ||
+ | prevScrollpos = currentScrollPos; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | window.addEventListener('DOMContentLoaded', () => { | ||
+ | const observer = new IntersectionObserver(entries => { | ||
+ | entries.forEach(entry => { | ||
+ | const id = entry.target.getAttribute('id'); | ||
+ | if (entry.intersectionRatio > 0) { | ||
+ | document.querySelector(`nav li a[href="#${id}"]`).parentElement.classList.add('active'); | ||
+ | } else { | ||
+ | document.querySelector(`nav li a[href="#${id}"]`).parentElement.classList.remove('active'); | ||
+ | } | ||
+ | }); | ||
+ | }); | ||
+ | // Track all sections that have an `id` applied | ||
+ | document.querySelectorAll('section[id]').forEach((section) => { | ||
+ | observer.observe(section); | ||
+ | }); | ||
+ | |||
+ | }); | ||
+ | </script> | ||
</html> | </html> |
Revision as of 12:03, 16 October 2021