(12 intermediate revisions by the same user not shown) | |||
Line 6: | Line 6: | ||
<title>About Us</title> | <title>About Us</title> | ||
<link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'> | <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'> | ||
+ | <!-- <link rel="stylesheet" href="https://2017.igem.org/Template:TAS_Taipei/Bootstrap"> <link rel="stylesheet" href="https://2017.igem.org/Template:TAS_Taipei/JqueryJS"> <script src="https://2017.igem.org/Template:TAS_Taipei/BootstrapJS"></script> --> | ||
<style type='text/css'> | <style type='text/css'> | ||
#top_title, | #top_title, | ||
Line 20: | Line 21: | ||
.cv { | .cv { | ||
− | box-shadow: 100px 0px 0 0px # | + | box-shadow: 100px 0px 0 0px #FBB5A4; |
+ | } | ||
+ | |||
+ | .this_border { | ||
+ | background-color: #FBB5A4; | ||
} | } | ||
Line 32: | Line 37: | ||
<div class="yellow"> | <div class="yellow"> | ||
<div class="box right"> | <div class="box right"> | ||
− | <div class="box2 right project" href="https://2017.igem.org/Team:TAS_Taipei/Background"> | + | <div class="box2 right project" href="https://2017.igem.org/Team:TAS_Taipei/Background"> <img src="https://static.igem.org/mediawiki/2017/0/00/T--TAS_Taipei--Project_C.png" id="dna"> |
− | + | ||
<h6 class="navCap">Project</h6> | <h6 class="navCap">Project</h6> | ||
</div> | </div> | ||
− | <div class="box2 right experiment" href="https://2017.igem.org/Team:TAS_Taipei/Experimental_Summary"> | + | <div class="box2 right experiment" href="https://2017.igem.org/Team:TAS_Taipei/Experimental_Summary"> <img src="https://static.igem.org/mediawiki/2017/b/b0/T--TAS_Taipei--Exp_C.png" id="dna"> |
− | + | ||
<h6 class="navCap">Experiments</h6> | <h6 class="navCap">Experiments</h6> | ||
</div> | </div> | ||
− | <div class="box2 right modeling" href="https://2017.igem.org/Team:TAS_Taipei/Model"> | + | <div class="box2 right modeling" href="https://2017.igem.org/Team:TAS_Taipei/Model"> <img src="https://static.igem.org/mediawiki/2017/b/be/T--TAS_Taipei--Modeling_C.png" id="dna"> |
− | + | ||
<h6 class="navCap">Modeling</h6> | <h6 class="navCap">Modeling</h6> | ||
</div> | </div> | ||
− | <div class="box2 right prototype" href="https://2017.igem.org/Team:TAS_Taipei/Applied_Design"> | + | <div class="box2 right prototype" href="https://2017.igem.org/Team:TAS_Taipei/Applied_Design"> <img src="https://static.igem.org/mediawiki/2017/2/2e/T--TAS_Taipei--Prototype_C.png" id="dna"> |
− | + | ||
<h6 class="navCap">Prototype</h6> | <h6 class="navCap">Prototype</h6> | ||
</div> | </div> | ||
− | <div class="box2 right policy" href="https://2017.igem.org/Team:TAS_Taipei/Human_Practices"> | + | <div class="box2 right policy" href="https://2017.igem.org/Team:TAS_Taipei/Human_Practices"> <img src="https://static.igem.org/mediawiki/2017/4/42/T--TAS_Taipei--HP2_C.png" id="dna"> |
− | + | ||
<h6 class="navCap">Human Practices</h6> | <h6 class="navCap">Human Practices</h6> | ||
</div> | </div> | ||
− | <div class="box2 right biosafety" href="https://2017.igem.org/Team:TAS_Taipei/Safety"> | + | <div class="box2 right biosafety" href="https://2017.igem.org/Team:TAS_Taipei/Safety"> <img src="https://static.igem.org/mediawiki/2017/b/b8/T--TAS_Taipei--Biosafety_C.png" id="dna"> |
− | + | ||
<h6 class="navCap">Safety</h6> | <h6 class="navCap">Safety</h6> | ||
</div> | </div> | ||
− | <div class="box2 right about" href="https://2017.igem.org/Team:TAS_Taipei/Team"> | + | <div class="box2 right about" href="https://2017.igem.org/Team:TAS_Taipei/Team"> <img src="https://static.igem.org/mediawiki/2017/1/1a/T--TAS_Taipei--About_Us_C.png" id="dna"> |
− | + | ||
<h6 class="navCap">About Us</h6> | <h6 class="navCap">About Us</h6> | ||
</div> | </div> | ||
− | <div class="box2 right acknowledgments" href="https://2017.igem.org/Team:TAS_Taipei/Attributions"> | + | <div class="box2 right acknowledgments" href="https://2017.igem.org/Team:TAS_Taipei/Attributions"> <img src="https://static.igem.org/mediawiki/2017/5/52/T--TAS_Taipei--Attributions_C.png" id="dna"> |
− | + | ||
<h6 class="navCap">Attributions</h6> | <h6 class="navCap">Attributions</h6> | ||
</div> | </div> | ||
Line 82: | Line 79: | ||
</div> | </div> | ||
<div class="box3 left biosafety" href="https://2017.igem.org/Team:TAS_Taipei/Safety"> | <div class="box3 left biosafety" href="https://2017.igem.org/Team:TAS_Taipei/Safety"> | ||
− | <h1> | + | <h1>Safety</h1> |
</div> | </div> | ||
<div class="box3 left about" href="https://2017.igem.org/Team:TAS_Taipei/Team"> | <div class="box3 left about" href="https://2017.igem.org/Team:TAS_Taipei/Team"> | ||
Line 92: | Line 89: | ||
</div> | </div> | ||
</div> | </div> | ||
− | <box class="home"> | + | <box class="home"> <img src="https://static.igem.org/mediawiki/2017/6/6c/T--TAS_Taipei--4home.svg" alt="Home" id="home" onclick="location.href='https://2017.igem.org/Team:TAS_Taipei';" style="cursor: pointer;"> </box> |
− | + | <div class="cv" id="cv"> | |
− | + | ||
− | <div class="cv"> | + | |
<div class="row"> | <div class="row"> | ||
− | < | + | <div class="col-lg-12"> |
− | < | + | <!-- header --> |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
<header> | <header> | ||
− | <div class="row"> | + | <div class="row" id="Notebook"> |
− | <h1 class="name">NOTEBOOK</h1> | + | <h1 class="name col-lg-12">NOTEBOOK</h1> |
</div> | </div> | ||
− | <div class="row this_border"></div><br> | + | <div class="row this_border"></div> |
+ | </header><br> | ||
+ | <section class="main"> | ||
<div class="row"> | <div class="row"> | ||
− | <a href="https://static.igem.org/mediawiki/2017/ | + | <a href="https://static.igem.org/mediawiki/2017/1/1b/T--TAS_Taipei--Protocols_new.pdf" type="button" class="btn btn-info col-lg-2 col-lg"> |
Protocols | Protocols | ||
+ | </a><br><br> | ||
+ | <a href="https://static.igem.org/mediawiki/2017/f/fd/T--TAS_Taipei--Cloning.pdf" type="button" class="btn btn-danger col-lg-2"> | ||
+ | Cloning | ||
+ | </a><br><br> | ||
+ | <a href="https://static.igem.org/mediawiki/2017/5/51/T--TAS_Taipei--Modeling_new.pdf" type="button" class="btn btn-success col-lg-2"> | ||
+ | Modeling | ||
+ | </a><br><br> | ||
+ | <a href="https://static.igem.org/mediawiki/2017/6/6e/T--TAS_Taipei--Biofilm_Approach.pdf" type="button" class="btn btn-warning col-lg-2"> | ||
+ | Biofilm Approach | ||
+ | </a><br><br> | ||
+ | <a href="https://static.igem.org/mediawiki/2017/9/9c/T--TAS_Taipei--Prototype-update.pdf" type="button" class="btn btn-default col-lg-2"> | ||
+ | Prototype | ||
</a> | </a> | ||
</div> | </div> | ||
− | </ | + | </section> |
</div> | </div> | ||
</div> | </div> | ||
− | + | </div> | |
− | + | </div> | |
− | + | <script> | |
− | + | $("a").on('click', function(event) { | |
− | + | if (this.hash !== "") { | |
− | + | event.preventDefault(); | |
− | + | var hash = this.hash; | |
− | + | $('html, body').animate({ | |
− | + | scrollTop: $(hash).offset().top | |
− | + | }, 300, function() { | |
− | + | // Add hash (#) to URL when done scrolling (default click behavior) | |
+ | window.location.hash = hash; | ||
+ | }); | ||
+ | } | ||
+ | }); | ||
+ | $(function() { | ||
+ | $('.yellow').removeClass('active'); | ||
+ | $('.yellow').mouseenter(function() { | ||
+ | var windowsize = $(window).width(); | ||
+ | if (windowsize > 1020) { | ||
+ | //if the window is greater than 1020px wide then hover | ||
+ | $('.yellow').addClass('active'); | ||
} | } | ||
+ | $('.navCap').addClass('deactive'); | ||
}); | }); | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
+ | $('.yellow').mouseleave(function() { | ||
+ | var windowsize = $(window).width(); | ||
+ | if (windowsize > 1020) { | ||
+ | //if the window is greater than 1020px wide then hover | ||
+ | $('.yellow').removeClass('active'); | ||
+ | } | ||
+ | $('.navCap').removeClass('deactive'); | ||
+ | }); | ||
− | + | $('.box2').click(function() { | |
− | + | var windowsize = $(window).width(); | |
− | + | if (windowsize < 1020) { | |
− | + | //if the window is less than 1020px wide then turn on click for mobile. | |
− | + | if ($('.yellow').hasClass('active')) { | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
window.location = $(this).attr('href'); | window.location = $(this).attr('href'); | ||
+ | } else { | ||
+ | $('.yellow').addClass('active'); | ||
+ | $('.return').addClass('active'); | ||
+ | $('.home').addClass('deactive'); | ||
} | } | ||
+ | } else { | ||
+ | window.location = $(this).attr('href'); | ||
+ | } | ||
− | + | }) | |
− | + | $('.box3').click(function() { | |
− | + | var windowsize = $(window).width(); | |
− | + | if (windowsize < 1020) { | |
− | + | //if the window is less than 1020px wide then turn on click for mobile. | |
− | + | if ($('.yellow').hasClass('active')) { | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
window.location = $(this).attr('href'); | window.location = $(this).attr('href'); | ||
+ | } else { | ||
+ | $('.yellow').addClass('active'); | ||
+ | $('.return').addClass('active'); | ||
+ | $('.home').addClass('deactive'); | ||
} | } | ||
− | }) | + | } else { |
+ | window.location = $(this).attr('href'); | ||
+ | } | ||
+ | }) | ||
− | + | $('.return').click(function() { | |
− | + | $('.yellow').removeClass('active'); | |
− | + | $('.return').removeClass('active'); | |
− | + | $('.home').removeClass('deactive'); | |
− | + | }) | |
− | + | $('.cv').click(function() { | |
− | + | $('.yellow').removeClass('active'); | |
− | + | $('.return').removeClass('active'); | |
− | + | $('.home').removeClass('deactive'); | |
− | + | }) | |
− | + | $('.jumbotron').mouseenter(function() { | |
− | + | $('.project').removeClass('active'); | |
− | + | $('.experiment').removeClass('active'); | |
− | + | $('.modeling').removeClass('active'); | |
− | }) | + | $('.prototype').removeClass('active'); |
+ | $('.biosafety').removeClass('active'); | ||
+ | $('.about').removeClass('active'); | ||
+ | $('.policy').removeClass('active'); | ||
+ | $('.acknowledgments').removeClass('active'); | ||
+ | }); | ||
− | + | $('.cv').mouseenter(function() { | |
− | + | $('.project').removeClass('active'); | |
− | + | $('.experiment').removeClass('active'); | |
− | + | $('.modeling').removeClass('active'); | |
− | + | $('.prototype').removeClass('active'); | |
− | + | $('.biosafety').removeClass('active'); | |
− | + | $('.about').removeClass('active'); | |
− | + | $('.policy').removeClass('active'); | |
− | + | $('.acknowledgments').removeClass('active'); | |
− | + | }); | |
− | + | $('.project').mouseenter(function() { | |
− | + | $('.project').addClass('active'); | |
− | + | $('.experiment').removeClass('active'); | |
− | + | $('.modeling').removeClass('active'); | |
− | + | $('.prototype').removeClass('active'); | |
− | + | $('.biosafety').removeClass('active'); | |
− | + | $('.about').removeClass('active'); | |
− | + | $('.policy').removeClass('active'); | |
− | + | $('.acknowledgments').removeClass('active'); | |
− | + | }); | |
− | + | $('.experiment').mouseenter(function() { | |
− | + | $('.project').removeClass('active'); | |
− | + | $('.experiment').addClass('active'); | |
− | + | $('.modeling').removeClass('active'); | |
− | + | $('.prototype').removeClass('active'); | |
− | + | $('.biosafety').removeClass('active'); | |
− | + | $('.about').removeClass('active'); | |
− | + | $('.policy').removeClass('active'); | |
− | + | $('.acknowledgments').removeClass('active'); | |
− | + | }); | |
− | + | $('.modeling').mouseenter(function() { | |
− | + | $('.project').removeClass('active'); | |
− | + | $('.experiment').removeClass('active'); | |
− | + | $('.modeling').addClass('active'); | |
− | + | $('.prototype').removeClass('active'); | |
− | + | $('.biosafety').removeClass('active'); | |
− | + | $('.about').removeClass('active'); | |
− | + | $('.policy').removeClass('active'); | |
− | + | $('.acknowledgments').removeClass('active'); | |
− | + | }); | |
− | + | $('.prototype').mouseenter(function() { | |
− | + | $('.project').removeClass('active'); | |
− | + | $('.experiment').removeClass('active'); | |
− | + | $('.modeling').removeClass('active'); | |
− | + | $('.prototype').addClass('active'); | |
− | + | $('.biosafety').removeClass('active'); | |
− | + | $('.about').removeClass('active'); | |
− | + | $('.policy').removeClass('active'); | |
− | + | $('.acknowledgments').removeClass('active'); | |
− | + | }); | |
− | + | $('.biosafety').mouseenter(function() { | |
− | + | $('.project').removeClass('active'); | |
− | + | $('.experiment').removeClass('active'); | |
− | + | $('.modeling').removeClass('active'); | |
− | + | $('.prototype').removeClass('active'); | |
− | + | $('.biosafety').addClass('active'); | |
− | + | $('.about').removeClass('active'); | |
− | + | $('.policy').removeClass('active'); | |
− | + | $('.acknowledgments').removeClass('active'); | |
− | + | }); | |
− | + | $('.about').mouseenter(function() { | |
− | + | $('.project').removeClass('active'); | |
− | + | $('.experiment').removeClass('active'); | |
− | + | $('.modeling').removeClass('active'); | |
− | + | $('.prototype').removeClass('active'); | |
− | + | $('.biosafety').removeClass('active'); | |
− | + | $('.about').addClass('active'); | |
− | + | $('.policy').removeClass('active'); | |
− | + | $('.acknowledgments').removeClass('active'); | |
− | + | }); | |
− | + | $('.policy').mouseenter(function() { | |
− | + | $('.project').removeClass('active'); | |
− | + | $('.experiment').removeClass('active'); | |
− | + | $('.modeling').removeClass('active'); | |
− | + | $('.prototype').removeClass('active'); | |
− | + | $('.biosafety').removeClass('active'); | |
− | + | $('.about').removeClass('active'); | |
− | + | $('.policy').addClass('active'); | |
− | + | $('.acknowledgments').removeClass('active'); | |
− | + | }); | |
− | + | $('.acknowledgments').mouseenter(function() { | |
− | + | $('.project').removeClass('active'); | |
− | + | $('.experiment').removeClass('active'); | |
− | + | $('.modeling').removeClass('active'); | |
− | + | $('.prototype').removeClass('active'); | |
− | + | $('.biosafety').removeClass('active'); | |
− | + | $('.about').removeClass('active'); | |
− | + | $('.policy').removeClass('active'); | |
− | + | $('.acknowledgments').addClass('active'); | |
− | + | }); | |
− | + | }) | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | </script> | |
</body> | </body> | ||
</html> | </html> |
Latest revision as of 11:31, 1 November 2017