Kasturi001 (Talk | contribs) |
|||
Line 1: | Line 1: | ||
− | {{ | + | <html xmlns="http://www.w3.org/1999/xhtml"> |
− | < | + | <head> |
+ | <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> | ||
+ | <title>CSS Newbie Example: Show/Hide Content</title> | ||
+ | <script language="javascript" type="text/javascript"> | ||
+ | function showHide(shID) { | ||
+ | if (document.getElementById(shID)) { | ||
+ | if (document.getElementById(shID+'-show').style.display != 'none') { | ||
+ | document.getElementById(shID+'-show').style.display = 'none'; | ||
+ | document.getElementById(shID).style.display = 'block'; | ||
+ | } | ||
+ | else { | ||
+ | document.getElementById(shID+'-show').style.display = 'inline'; | ||
+ | document.getElementById(shID).style.display = 'none'; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | </script> | ||
+ | <style> | ||
+ | .more { | ||
+ | display: none; | ||
+ | border-top: 1px solid #666; | ||
+ | border-bottom: 1px solid #666; } | ||
+ | a.showLink, a.hideLink { | ||
+ | text-decoration: none; | ||
+ | color: #36f; | ||
+ | padding-left: 8px; | ||
+ | background: transparent url(down.gif) no-repeat left; } | ||
+ | a.hideLink { | ||
+ | background: transparent url(up.gif) no-repeat left; } | ||
+ | a.showLink:hover, a.hideLink:hover { | ||
+ | border-bottom: 1px dotted #36f; } | ||
− | |||
− | |||
− | |||
+ | .topmenu-container { | ||
+ | overflow: hidden; | ||
+ | background-color: #000; | ||
+ | font-family: Arial; | ||
+ | padding-top:10px; | ||
+ | } | ||
+ | .topmenu-container a { | ||
+ | float: left; | ||
+ | font-size: 16px; | ||
+ | color: white; | ||
+ | text-align: center; | ||
+ | padding: 10px 16px; | ||
+ | text-decoration: none; | ||
+ | } | ||
− | + | .dropdown { | |
− | + | float: left; | |
− | + | overflow: hidden; | |
− | + | } | |
− | + | .dropdown .dropbtn { | |
+ | font-size: 16px; | ||
+ | border: none; | ||
+ | outline: none; | ||
+ | color: white; | ||
+ | padding: 14px 16px; | ||
+ | background-color: inherit; | ||
+ | } | ||
− | + | .dropdown-content { | |
− | + | display: none; | |
− | + | position: absolute; | |
− | + | background-color: #f9f9f9; | |
− | + | min-width: 160px; | |
− | + | box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | |
− | + | z-index: 1; | |
− | + | } | |
− | + | ||
− | + | .dropdown-content a { | |
− | + | float: none; | |
− | + | color: black; | |
− | + | padding: 12px 16px; | |
− | + | text-decoration: none; | |
− | + | display: block; | |
− | + | text-align: center; | |
+ | } | ||
− | + | .topmenucontainer a:hover, .dropdown:hover .dropbtn { | |
− | + | background-color: red; | |
− | + | } | |
− | + | .dropdown-content a:hover { | |
+ | background-color: #ddd; | ||
+ | } | ||
+ | .dropdown:hover .dropdown-content { | ||
+ | display: inline-block; | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
− | < | + | <body> |
− | < | + | |
− | < | + | |
− | < | + | <h1><font size = "18"> <font face = "Arial"> <center>GENEBOTS</center></font></font></h1> |
+ | <br/> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
+ | <div class="topmenu-container"> | ||
− | <div class=" | + | <div class="dropdown"> |
− | + | <a href="https://2017.igem.org/Team:NTU_Singapore/NTU-SG" target="_blank">NTU-Singapore</a></button> | |
− | + | </div> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | < | + | |
− | + | ||
− | + | ||
− | + | ||
</div> | </div> | ||
− | <div class=" | + | <div class="topmenu-container"> |
− | < | + | <div class="dropdown"> |
− | < | + | <a href="#" id="Introduction-show" class="showLink" onclick="showHide('Introduction');return false;">Introduction</a></p> |
− | + | </div> | |
+ | </div> | ||
− | <a href="https://2017.igem.org/ | + | <div class="topmenu-container"> |
− | + | <div class="dropdown"> | |
− | </a> | + | <button class="dropbtn">Projects</button> |
− | </ | + | <div class="dropdown-content"> |
+ | <a href="https://2017.igem.org/Team:NTU_Singapore/Truncation" target="_blank">Truncation</a> | ||
+ | <a href="https://2017.igem.org/Team:NTU_Singapore/HDR" target="_blank">Homology Directed Repair</a> | ||
+ | <a href="https://2017.igem.org/Team:NTU_Singapore/Application" target="_blank">Application</a> | ||
+ | </div> | ||
+ | </div> | ||
</div> | </div> | ||
+ | <div class="topmenu-container"> | ||
+ | <div class="dropdown"> | ||
+ | <a href="https://2017.igem.org/Team:NTU_Singapore/collaboration" target="_blank">Collaboration</a></button> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="topmenu-container"> | ||
+ | <div class="dropdown"> | ||
+ | <a href="#" id="Parts-show" class="showLink" onclick="showHide('Parts');return false;">Parts</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="topmenu-container"> | ||
+ | <div class="dropdown"> | ||
+ | <a href="#" id="HumanPractice-show" class="showLink" onclick="showHide('HumanPractice');return false;">Human Practice</a></p> | ||
+ | </div> | ||
+ | </div> | ||
+ | <br/> | ||
+ | <br/> | ||
+ | |||
+ | <div id="Introduction" class="more"> | ||
+ | <h2><p><font face = "Georgia"><center>Introduction</center></font></p></h2> | ||
+ | <p>Clustered regularly interspaced short palindromic repeats (CRISPR) are segments of prokaryotic DNA containing short, repetitive base sequences. These play a key role in a bacterial defence system, and form the basis of a genome editing technology known as CRISPR/Cas9 that allows permanent modification of genes within organisms.</p> | ||
+ | <p>In a palindromic repeat, the sequence of nucleotides is the same in both directions. Each repetition is followed by short segments of spacer DNA from previous exposures to foreign DNA (e.g., a virus or plasmid). Small clusters of cas (CRISPR-associated system) genes are located next to CRISPR sequences.</p> | ||
+ | </p> | ||
+ | <a href="#" id="Introduction-hide" class="hideLink" onclick="showHide('Introduction');return false;">Hide this content.</a></p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <div id="HumanPractice" class="more"> | ||
+ | <h2><p><font face = "Georgia"><center>Human Practice</center></font></p></h2> | ||
+ | <p>This is where you type about Human Practice</p> | ||
+ | <a href="#" id="HumanPractice-hide" class="hideLink" onclick="showHide('HumanPractice');return false;">Hide this content.</a></p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div id="Parts" class="more"> | ||
+ | <h2><p><font face = "Georgia"><center>Parts</center></font></p></h2> | ||
+ | <p>This is where you type about Parts</p> | ||
+ | <a href="#" id="Parts-hide" class="hideLink" onclick="showHide('Parts');return false;">Hide this content.</a></p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <br/> | ||
+ | </body> | ||
</html> | </html> |
Revision as of 15:46, 27 August 2017
GENEBOTS
Clustered regularly interspaced short palindromic repeats (CRISPR) are segments of prokaryotic DNA containing short, repetitive base sequences. These play a key role in a bacterial defence system, and form the basis of a genome editing technology known as CRISPR/Cas9 that allows permanent modification of genes within organisms.
In a palindromic repeat, the sequence of nucleotides is the same in both directions. Each repetition is followed by short segments of spacer DNA from previous exposures to foreign DNA (e.g., a virus or plasmid). Small clusters of cas (CRISPR-associated system) genes are located next to CRISPR sequences.
Hide this content.