Difference between revisions of "Team:Mingdao"

Line 212: Line 212:
 
     document.getElementById('vid').play();
 
     document.getElementById('vid').play();
 
</script>
 
</script>
−
≈
+
 
−
      <div class="my-main-container">
+
−
        <div class="main-content">
+
−
          <div class="text-area">
+
−
         
+
−
          </div>
+
−
        </div>
+
−
      </div>
+
−
    </div>
+
−
    <div class="path-btns" style="left:0;">
+
−
      <div class="path">
+
−
        <div class="pathSvg">
+
−
          <svg width="80" height = "100">
+
−
            <rect x ="36" y="20" width="6" height="80" style="fill:#385e66"/>
+
−
          </svg>
+
−
        </div>
+
−
        <div id="d-overview-btn" class="path-dot"></div>
+
−
        <div class="pathWord path-word-sm">
+
−
          <p>Syringe</p>
+
−
        </div>
+
−
      </div>
+
−
      <div class="path">
+
−
        <div class="pathSvg">
+
−
          <svg width="80" height = "100">
+
−
            <rect x ="36" y="20" width="6" height="80" style="fill:#385e66"/>
+
−
          </svg>
+
−
        </div>
+
−
        <div id="d-intro-btn" class="path-dot" style="top: 100px"></div>
+
−
        <div class="pathWord path-word-sm">
+
−
          <p>GFP System</p>
+
−
        </div>
+
−
      </div>
+
−
      <div class="path">
+
−
        <div class="pathSvg">
+
−
          <svg width="80" height = "100">
+
−
            <rect x ="36" y="20" width="6" height="80" style="fill:#385e66"/>
+
−
          </svg>
+
−
        </div>
+
−
        <div id="d-antidote-btn" class="path-dot" style="top: 200px"></div>
+
−
        <div class="pathWord path-word-sm">
+
−
          <p>Mosquito Immune Signaling</p>
+
−
        </div>
+
−
      </div>
+
−
      <div class="path">
+
−
        <div class="pathSvg">
+
−
          <svg width="80" height = "100">
+
−
            <rect x ="36" y="20" width="0" height="80" style="fill:#385e66"/>
+
−
          </svg>
+
−
        </div>
+
−
        <div id="d-detective-btn" class="path-dot" style="top: 300px"></div>
+
−
        <div class="pathWord path-word-sm">
+
−
          <p>AMP System</p>
+
−
        </div>
+
−
      </div>
+
−
    </div>
+
−
    <div class="top">
+
−
      <img src="https://static.igem.org/mediawiki/2017/5/52/T--CSMU_NCHU_Taiwan--top.png" alt="">
+
−
    </div>
+
  
 
<div class="row">
 
<div class="row">

Revision as of 10:45, 13 October 2018

HOME
Description

Project Motivation

Experimental Principle

DM

see more

$("#d-overview-btn").click(function() { $('html, body').animate({ scrollTop: $("#d-overview").offset().top }, 500); }); $("#d-intro-btn").click(function() { $('html, body').animate({ scrollTop: $("#d-intro").offset().top }, 500); }); $("#d-antidote-btn").click(function() { $('html, body').animate({ scrollTop: $("#d-antidote").offset().top }, 500); }); $("#d-detective-btn").click(function() { $('html, body').animate({ scrollTop: $("#d-detective").offset().top }, 500); }); $(document).ready(function(){ $('.top').on('click', function(){ $('html, body').animate({scrollTop: '0px'}, 500); }); $("#d-overview-btn").css('background-color', '#385e66'); var scroll_pos = 0; $(document).scroll(function() { scroll_pos = $(this).scrollTop(); d_overview_pos = $("#d-overview").offset().top -100 d_intro_pos = $("#d-intro").offset().top -100 d_antidote_pos = $("#d-antidote").offset().top -100 d_detective_pos = $("#d-detective").offset().top -100 // overview if(scroll_pos < d_intro_pos) { $(".path-dot").css('background-color', '#fff') $("#d-overview-btn").css('background-color', '#385e66'); // intro } else if(scroll_pos < d_antidote_pos){ if(scroll_pos >= d_intro_pos){ $(".path-dot").css('background-color', '#fff') $("#d-intro-btn").css('background-color', '#385e66');} // antidote } else if(scroll_pos < d_detective_pos){ if(scroll_pos >= d_antidote_pos){ $(".path-dot").css('background-color', '#fff') $("#d-antidote-btn").css('background-color', '#385e66');} } //detective else if( scroll_pos >= d_detective_pos) { $(".path-dot").css('background-color', '#fff') $("#d-detective-btn").css('background-color', '#385e66'); } }); });