Difference between revisions of "Team:TAS Taipei/Notebook"
| 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 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="jumbotron" id="prototype-jumbo"> |
| − | <div class="cv"> | + | <div class="container"> |
| + | <h1>Prototype</h1> | ||
| + | <h4>Design, Build, and Test: Putting our project to work</h4> | ||
| + | </div> <a href="#cv"><img src="https://static.igem.org/mediawiki/2017/4/4a/T--TAS_Taipei--Chevron_500px_200ppi.png" alt="test" id="chevron"></a> </div> | ||
| + | <!--全版面大型看板結尾--> | ||
| + | <div class="cv" id="cv"> | ||
<div class="row"> | <div class="row"> | ||
| − | <nav class="pageNav col-lg- | + | <nav class="pageNav col-lg-1_5"> |
<ul class="nav"> | <ul class="nav"> | ||
| − | <li> | + | <li> <a href="#Notebook" class="pageNavBig">Notebook</a> </li> |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
</ul> | </ul> | ||
</nav> | </nav> | ||
| − | <div class="white col-lg-2"> | + | <div class="white col-lg-2"> hi </div> |
| − | + | ||
| − | + | ||
<div class="col-lg-10"> | <div class="col-lg-10"> | ||
| + | <!-- 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>< | + | <div class="row this_border"></div> |
| + | </header> | ||
| + | <section class="main"> | ||
<div class="row"> | <div class="row"> | ||
<a href="https://static.igem.org/mediawiki/2017/8/86/T--TAS_Taipei--Protocols.pdf" type="button" class="btn btn-info col-lg-4"> | <a href="https://static.igem.org/mediawiki/2017/8/86/T--TAS_Taipei--Protocols.pdf" type="button" class="btn btn-info col-lg-4"> | ||
| − | + | Click here to see Tom Brown’s full response | |
</a> | </a> | ||
| − | </div> | + | </div><br> |
| − | </ | + | </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> | ||
Revision as of 08:23, 20 October 2017
X
Project
Experiments
Modeling
Prototype
Human Practices
Safety
About Us
Attributions
Project
Experiment
Modeling
Prototype
Human Practice
Biosafety
About Us
Attributions
Prototype
Design, Build, and Test: Putting our project to work
hi
