Difference between revisions of "Team:CGU Taiwan/Notebook"

Line 97: Line 97:
  
 
<!-- notebook start -->
 
<!-- notebook start -->
−
<div class="notebooklist">
+
<div class="notebook">
−
<ul class="week">
+
<div class="notebooktitle"><h2>NOTEBOOK | LAB NOTE</h2></div>
−
<li class="select">
+
<!-- BIO-DEVELOPMENT內容開始 -->
−
    <div>
+
<div class="biolist"><h2>BIO-DEVELOPMENT</h2></div>
−
    <button id="btngeneral" type="button">General</button>
+
<div class="content">(Lab Note)
−
<button id="btnmarketing" type="button">Marketing</button>
+
<div class="biobutton">
−
    <button id="btnbiology" type="button">Biology Science</button>
+
<button id="SequenceDesign" type="button" style="width:140px;height:45px;font-size:13px;background-color:#205e87;color:white;vertical-align:middle;">Sequence Design</button>
−
<button id="btninformation" type="button">Information Science</button>
+
<button id="ConstructionPlasmids" type="button" style="width:140px;height:45px;font-size:13px;background-color:#205e87;color:white;vertical-align:middle;">Construction of Plasmids</button>
−
    <button id="btnengineering" type="button">Engineering Science</button>   
+
<button id="ProteinExpression" type="button" style="width:140px;height:45px;font-size:13px;background-color:#205e87;color:white;vertical-align:middle;">Protein Expression in Yeast</button>
−
    </div>
+
<button id="ProteinCollection" type="button" style="width:140px;height:45px;font-size:13px;background-color:#205e87;color:white;vertical-align:middle;">Protein Collection</button>
−
    </li>
+
<button id="YeastAffinity" type="button" style="width:140px;height:45px;font-size:13px;background-color:#205e87;color:white;vertical-align:middle;">Yeast-Stain Affinity</button>
−
    <li class="week1">
+
<button id="Troubleshootingloning" type="button" style="width:140px;height:45px;font-size:13px;background-color:#205e87;color:white;vertical-align:middle;">Troubleshooting of cloning</button>
−
<div>Week 1 (Feb 19~Feb 25)</div>
+
−
    <br>
+
−
<div><b>General note 1 :<button id="btn1" type="button">Collapse</button>
+
−
<button id="btn2" type="button">Expand</button></b>
+
−
    <p class="generalcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week1 General內容結束 -->
+
−
    <div><b>Marketing note 1 :<button id="btn3" type="button">Collapse</button>
+
−
<button id="btn4" type="button">Expand</button></b>
+
−
    <p class="marketingcontent" style="display: block;">text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week1 Marketing內容結束 -->
+
−
    <div><b>Biology Science note 1 :<button id="btn5" type="button">Collapse</button>
+
−
<button id="btn6" type="button">Expand</button></b>
+
−
    <p class="biologycontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week1 Biology Science內容結束 -->
+
−
    <div><b>Information Science note 1 :<button id="btn7" type="button">Collapse</button>
+
−
<button id="btn8" type="button">Expand</button></b>
+
−
    <p class="informationcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week1 Information Science內容結束 -->
+
−
    <div><b>Engineering Science note 1 :<button id="btn9" type="button">Collapse</button>
+
−
<button id="btn10" type="button">Expand</button></b>
+
−
    <p class="engineeringcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week1 Engineering Science內容結束 -->
+
−
    <div><button id="btn11" type="button">Collapse</button>
+
−
<button id="btn12" type="button">Expand</button></div>
+
−
</li>
+
−
    <!-- week1所有內容結束 -->
+
−
    <br>
+
−
    <li class="week2">
+
−
<div>Week 2 (Feb 26~Mar 4)</div>
+
−
    <br>
+
−
<div><b>General note 2 :<button id="btn13" type="button">Collapse</button>
+
−
<button id="btn14" type="button">Expand</button></b>
+
−
    <p class="generalcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week2 General內容結束 -->
+
−
    <div><b>Marketing note 2 :<button id="btn15" type="button">Collapse</button>
+
−
<button id="btn16" type="button">Expand</button></b>
+
−
    <p class="marketingcontent" style="display: block;">text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week2 Marketing內容結束 -->
+
−
    <div><b>Biology Science note 2 :<button id="btn17" type="button">Collapse</button>
+
−
<button id="btn18" type="button">Expand</button></b>
+
−
    <p class="biologycontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week2 Biology Science內容結束 -->
+
−
    <div><b>Information Science note 2 :<button id="btn19" type="button">Collapse</button>
+
−
<button id="btn20" type="button">Expand</button></b>
+
−
    <p class="informationcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week2 Information Science內容結束 -->
+
−
    <div><b>Engineering Science note 2 :<button id="btn21" type="button">Collapse</button>
+
−
<button id="btn22" type="button">Expand</button></b>
+
−
    <p class="engineeringcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week2 Engineering Science內容結束 -->
+
−
    <div><button id="btn23" type="button">Collapse</button>
+
−
<button id="btn24" type="button">Expand</button></div>
+
−
</li>
+
−
    <!-- week2所有內容結束 -->
+
−
    <br>
+
−
    <li class="week3">
+
−
<div>Week 3 (Mar 5~Mar 11)</div>
+
−
    <br>
+
−
<div><b>General note 3 :<button id="btn25" type="button">Collapse</button>
+
−
<button id="btn26" type="button">Expand</button></b>
+
−
    <p class="generalcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week3 General內容結束 -->
+
−
    <div><b>Marketing note 3 :<button id="btn27" type="button">Collapse</button>
+
−
<button id="btn28" type="button">Expand</button></b>
+
−
    <p class="marketingcontent" style="display: block;">text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week3 Marketing內容結束 -->
+
−
    <div><b>Biology Science note 3 :<button id="btn29" type="button">Collapse</button>
+
−
<button id="btn30" type="button">Expand</button></b>
+
−
    <p class="biologycontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week3 Biology Science內容結束 -->
+
−
    <div><b>Information Science note 3 :<button id="btn31" type="button">Collapse</button>
+
−
<button id="btn32" type="button">Expand</button></b>
+
−
    <p class="informationcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week3 Information Science內容結束 -->
+
−
    <div><b>Engineering Science note 3 :<button id="btn33" type="button">Collapse</button>
+
−
<button id="btn34" type="button">Expand</button></b>
+
−
    <p class="engineeringcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week3 Engineering Science內容結束 -->
+
−
    <div><button id="btn35" type="button">Collapse</button>
+
−
<button id="btn36" type="button">Expand</button></div>
+
−
</li>
+
−
    <!-- week3所有內容結束 -->
+
−
    <br>
+
−
    <li class="week4">
+
−
<div>Week 4 (Mar 12~Mar 18)</div>
+
−
    <br>
+
−
<div><b>General note 4 :<button id="btn37" type="button">Collapse</button>
+
−
<button id="btn38" type="button">Expand</button></b>
+
−
    <p class="generalcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week4 General內容結束 -->
+
−
    <div><b>Marketing note 4 :<button id="btn39" type="button">Collapse</button>
+
−
<button id="btn40" type="button">Expand</button></b>
+
−
    <p class="marketingcontent" style="display: block;">text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week4 Marketing內容結束 -->
+
−
    <div><b>Biology Science note 4 :<button id="btn41" type="button">Collapse</button>
+
−
<button id="btn42" type="button">Expand</button></b>
+
−
    <p class="biologycontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week4 Biology Science內容結束 -->
+
−
    <div><b>Information Science note 4 :<button id="btn43" type="button">Collapse</button>
+
−
<button id="btn44" type="button">Expand</button></b>
+
−
    <p class="informationcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week4 Information Science內容結束 -->
+
−
    <div><b>Engineering Science note 4 :<button id="btn45" type="button">Collapse</button>
+
−
<button id="btn46" type="button">Expand</button></b>
+
−
    <p class="engineeringcontent" style="display: block;"> text text text text text text text</p>
+
−
    </div>
+
−
    <!-- week4 Engineering Science內容結束 -->
+
−
    <div><button id="btn47" type="button">Collapse</button>
+
−
<button id="btn48" type="button">Expand</button></div>
+
−
</li>
+
−
    <!-- week4所有內容結束 -->
+
−
   
+
−
</ul>
+
 
</div>
 
</div>
−
<script type="text/javascript">
+
</div>
−
var temp=0;
+
<!-- BIO-DEVELOPMENT內容結束 -->
−
$(document).ready(function(){
+
−
$("p").toggle("100");
+
−
$("b").toggle("100");
+
−
///////////////////////////////////////////////////////////////////////
+
−
$("#btngeneral").click(function(){
+
−
if(temp==1)
+
−
{
+
−
$("div ul li.week1 p.generalcontent").hide("100");
+
−
    $("div ul li.week2 p.generalcontent").hide("100");
+
−
$("div ul li.week3 p.generalcontent").hide("100");
+
−
$("div ul li.week4 p.generalcontent").hide("100");
+
−
temp = 0;
+
−
}
+
−
else
+
−
{
+
−
$("div ul li.week1 p.generalcontent").fadeIn("100");
+
−
    $("div ul li.week2 p.generalcontent").fadeIn("100");
+
−
$("div ul li.week3 p.generalcontent").fadeIn("100");
+
−
$("div ul li.week4 p.generalcontent").fadeIn("100");
+
−
temp = 1;
+
−
}
+
−
    });
+
−
    $("#btnmarketing").click(function(){
+
−
if(temp==1)
+
−
{
+
−
$("div ul li.week1 p.marketingcontent").hide("100");
+
−
    $("div ul li.week2 p.marketingcontent").hide("100");
+
−
$("div ul li.week3 p.marketingcontent").hide("100");
+
−
$("div ul li.week4 p.marketingcontent").hide("100");
+
−
temp = 0;
+
−
}
+
−
else
+
−
{
+
−
$("div ul li.week1 p.marketingcontent").fadeIn("100");
+
−
    $("div ul li.week2 p.marketingcontent").fadeIn("100");
+
−
$("div ul li.week3 p.marketingcontent").fadeIn("100");
+
−
$("div ul li.week4 p.marketingcontent").fadeIn("100");
+
−
temp = 1;
+
−
}
+
−
    });
+
  
−
$("#btnbiology").click(function(){
+
<!-- MODELING內容開始 -->
−
if(temp==1)
+
<div class="modellist"><h2>MODELING</h2></div>
−
{
+
<div class="content">(Lab Note)</div>
−
$("div ul li.week1 p.biologycontent").hide("100");
+
<!-- MODELING內容結束 -->
−
$("div ul li.week2 p.biologycontent").hide("100");
+
−
$("div ul li.week3 p.biologycontent").hide("100");
+
−
$("div ul li.week4 p.biologycontent").hide("100");
+
−
temp = 0;
+
−
}
+
−
else
+
−
{
+
−
    $("div ul li.week1 p.biologycontent").fadeIn("100");
+
−
$("div ul li.week2 p.biologycontent").fadeIn("100");
+
−
$("div ul li.week3 p.biologycontent").fadeIn("100");
+
−
$("div ul li.week4 p.biologycontent").fadeIn("100");
+
−
temp = 1;
+
−
}
+
−
    });
+
−
+
−
    $("#btninformation").click(function(){
+
−
if(temp==1)
+
−
{
+
−
$("div ul li.week1 p.informationcontent").hide("100");
+
−
$("div ul li.week2 p.informationcontent").hide("100");
+
−
$("div ul li.week3 p.informationcontent").hide("100");
+
−
$("div ul li.week4 p.informationcontent").hide("100");
+
−
temp = 0;
+
−
}
+
−
else
+
−
{
+
−
    $("div ul li.week1 p.informationcontent").fadeIn("100");
+
−
$("div ul li.week2 p.informationcontent").fadeIn("100");
+
−
$("div ul li.week3 p.informationcontent").fadeIn("100");
+
−
$("div ul li.week4 p.informationcontent").fadeIn("100");
+
−
temp = 1;
+
−
}
+
−
    });
+
−
+
−
$("#btnengineering").click(function(){
+
−
if(temp==1)
+
−
{
+
−
$("div ul li.week1 p.engineeringcontent").hide("100");
+
−
$("div ul li.week2 p.engineeringcontent").hide("100");
+
−
$("div ul li.week3 p.engineeringcontent").hide("100");
+
−
$("div ul li.week4 p.engineeringcontent").hide("100");
+
−
temp = 0;
+
−
}
+
−
else
+
−
{
+
−
    $("div ul li.week1 p.engineeringcontent").fadeIn("100");
+
−
$("div ul li.week2 p.engineeringcontent").fadeIn("100");
+
−
$("div ul li.week3 p.engineeringcontent").fadeIn("100");
+
−
$("div ul li.week4 p.engineeringcontent").fadeIn("100");
+
−
temp = 1;
+
−
}
+
−
    });
+
−
+
−
/////////////////week btn//////////////////////////////////////////////
+
−
+
−
+
−
$("#btn1").click(function(){
+
−
if(temp==1){
+
−
    $("div ul li.week1 p.generalcontent").hide("100");
+
−
temp = 0;
+
−
$("btn1").text("Expand");
+
−
}
+
−
else{
+
−
+
−
    $("div ul li.week1 p.generalcontent").fadeIn("100");
+
−
    temp = 1;
+
−
$("btn1").text("Collapse");
+
−
}
+
−
    });
+
−
/*
+
−
$("#btn1").click(function(){
+
−
    $("div ul li.week1 p.generalcontent").hide("100");
+
−
    });
+
−
    $("#btn2").click(function(){
+
−
    $("div ul li.week1 p.generalcontent").fadeIn("100");
+
−
    });
+
−
*/
+
  
−
$("#btn3").click(function(){
+
<!-- Engineering內容開始 -->
−
    $("div ul li.week1 p.marketingcontent").hide("100");
+
<div class="engineeringlist"><h2>ENGINEERING</h2></div>
−
    });
+
<div class="content">(Lab Note)</div>
−
    $("#btn4").click(function(){
+
<!-- Engineering內容結束 -->
−
    $("div ul li.week1 p.marketingcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn5").click(function(){
+
−
    $("div ul li.week1 p.biologycontent").hide("100");
+
−
    });
+
−
    $("#btn6").click(function(){
+
−
    $("div ul li.week1 p.biologycontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn7").click(function(){
+
−
    $("div ul li.week1 p.informationcontent").hide("100");
+
−
    });
+
−
    $("#btn8").click(function(){
+
−
    $("div ul li.week1 p.informationcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn9").click(function(){
+
−
    $("div ul li.week1 p.engineeringcontent").hide("100");
+
−
    });
+
−
    $("#btn10").click(function(){
+
−
    $("div ul li.week1 p.engineeringcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn11").click(function(){
+
−
    $("div ul li.week1 b").hide("100");
+
−
$("div ul li.week1 p.generalcontent").hide("100");
+
−
$("div ul li.week1 p.marketingcontent").hide("100");
+
−
$("div ul li.week1 p.biologycontent").hide("100");
+
−
$("div ul li.week1 p.informationcontent").hide("100");
+
−
$("div ul li.week1 p.engineeringcontent").hide("100");
+
−
    });
+
−
    $("#btn12").click(function(){
+
−
    $("div ul li.week1 b").fadeIn("100");
+
−
    });
+
−
////////////////////////////////////////////////////////////////////////
+
−
$("#btn13").click(function(){
+
−
    $("div ul li.week2 p.generalcontent").hide("100");
+
−
    });
+
−
    $("#btn14").click(function(){
+
−
    $("div ul li.week2 p.generalcontent").fadeIn("100");
+
−
    });
+
  
−
$("#btn15").click(function(){
+
<!-- Marketing內容開始 -->
−
    $("div ul li.week2 p.marketingcontent").hide("100");
+
<div class="marketinglist"><h2>MARKETING</h2></div>
−
    });
+
<div class="content">(Lab Note)</div>
−
    $("#btn16").click(function(){
+
<!-- Marketing內容結束 -->
−
    $("div ul li.week2 p.marketingcontent").fadeIn("100");
+
</div>
−
    });
+
−
+
−
$("#btn17").click(function(){
+
−
    $("div ul li.week2 p.biologycontent").hide("100");
+
−
    });
+
−
    $("#btn18").click(function(){
+
−
    $("div ul li.week2 p.biologycontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn19").click(function(){
+
−
    $("div ul li.week2 p.informationcontent").hide("100");
+
−
    });
+
−
    $("#btn20").click(function(){
+
−
    $("div ul li.week2 p.informationcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn21").click(function(){
+
−
    $("div ul li.week2 p.engineeringcontent").hide("100");
+
−
    });
+
−
    $("#btn22").click(function(){
+
−
    $("div ul li.week2 p.engineeringcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn23").click(function(){
+
−
    $("div ul li.week2 b").hide("100");
+
−
$("div ul li.week2 p.generalcontent").hide("100");
+
−
$("div ul li.week2 p.marketingcontent").hide("100");
+
−
$("div ul li.week2 p.biologycontent").hide("100");
+
−
$("div ul li.week2 p.informationcontent").hide("100");
+
−
$("div ul li.week2 p.engineeringcontent").hide("100");
+
−
    });
+
−
    $("#btn24").click(function(){
+
−
    $("div ul li.week2 b").fadeIn("100");
+
−
    });
+
−
///////////////////////////////////////////////////////////////////////
+
−
$("#btn25").click(function(){
+
−
    $("div ul li.week3 p.generalcontent").hide("100");
+
−
    });
+
−
    $("#btn26").click(function(){
+
−
    $("div ul li.week3 p.generalcontent").fadeIn("100");
+
−
    });
+
−
 
+
−
$("#btn27").click(function(){
+
−
    $("div ul li.week3 p.marketingcontent").hide("100");
+
−
    });
+
−
    $("#btn28").click(function(){
+
−
    $("div ul li.week3 p.marketingcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn29").click(function(){
+
−
    $("div ul li.week3 p.biologycontent").hide("100");
+
−
    });
+
−
    $("#btn30").click(function(){
+
−
    $("div ul li.week3 p.biologycontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn31").click(function(){
+
−
    $("div ul li.week3 p.informationcontent").hide("100");
+
−
    });
+
−
    $("#btn32").click(function(){
+
−
    $("div ul li.week3 p.informationcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn33").click(function(){
+
−
    $("div ul li.week3 p.engineeringcontent").hide("100");
+
−
    });
+
−
    $("#btn34").click(function(){
+
−
    $("div ul li.week3 p.engineeringcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn35").click(function(){
+
−
    $("div ul li.week3 b").hide("100");
+
−
$("div ul li.week3 p.generalcontent").hide("100");
+
−
$("div ul li.week3 p.marketingcontent").hide("100");
+
−
$("div ul li.week3 p.biologycontent").hide("100");
+
−
$("div ul li.week3 p.informationcontent").hide("100");
+
−
$("div ul li.week3 p.engineeringcontent").hide("100");
+
−
    });
+
−
    $("#btn36").click(function(){
+
−
    $("div ul li.week3 b").fadeIn("100");
+
−
    });
+
−
///////////////////////////////////////////////////////////////////////
+
−
$("#btn37").click(function(){
+
−
    $("div ul li.week4 p.generalcontent").hide("100");
+
−
    });
+
−
    $("#btn38").click(function(){
+
−
    $("div ul li.week4 p.generalcontent").fadeIn("100");
+
−
    });
+
−
 
+
−
$("#btn39").click(function(){
+
−
    $("div ul li.week4 p.marketingcontent").hide("100");
+
−
    });
+
−
    $("#btn40").click(function(){
+
−
    $("div ul li.week4 p.marketingcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn41").click(function(){
+
−
    $("div ul li.week4 p.biologycontent").hide("100");
+
−
    });
+
−
    $("#btn42").click(function(){
+
−
    $("div ul li.week4 p.biologycontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn43").click(function(){
+
−
    $("div ul li.week4 p.informationcontent").hide("100");
+
−
    });
+
−
    $("#btn44").click(function(){
+
−
    $("div ul li.week4 p.informationcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn45").click(function(){
+
−
    $("div ul li.week4 p.engineeringcontent").hide("100");
+
−
    });
+
−
    $("#btn46").click(function(){
+
−
    $("div ul li.week4 p.engineeringcontent").fadeIn("100");
+
−
    });
+
−
+
−
$("#btn47").click(function(){
+
−
    $("div ul li.week4 b").hide("100");
+
−
    });
+
−
    $("#btn48").click(function(){
+
−
    $("div ul li.week4 b").fadeIn("100");
+
−
    });
+
−
});
+
−
</script>
+
 
<!-- notebook end -->
 
<!-- notebook end -->
 +
<!-- javascript code start -->
 +
 +
<!-- javascript code end -->
  
 
<!-- footer start -->
 
<!-- footer start -->

Revision as of 04:42, 22 October 2017

iGem CGU_Taiwan 2017 - Notebook

NOTEBOOK | LAB NOTE

BIO-DEVELOPMENT

(Lab Note)

MODELING

(Lab Note)

ENGINEERING

(Lab Note)

MARKETING

(Lab Note)