|
|
| (6 intermediate revisions by 2 users not shown) |
| Line 2: |
Line 2: |
| | <html> | | <html> |
| | | | |
| − |
| |
| − |
| |
| − |
| |
| − | </div>
| |
| | | | |
| | | | |
| Line 15: |
Line 11: |
| | <h3>Part Table </h3> | | <h3>Part Table </h3> |
| | | | |
| − | <h1> Parts overview </h1> | + | <p>Please include a table of all the parts your team has made during your project on this page. Remember part characterization and measurement data must go on your team part pages on the Registry. </p> |
| | | | |
| | </html> | | </html> |
| − | <groupparts>iGEM19 HK_SSC</groupparts></br> | + | <groupparts>iGEM19 HK_SSC Example</groupparts> |
| − | | + | |
| − | /* Main content */
| + | |
| − | .main {
| + | |
| − | margin-left: 240px; /* Same as the width of the sidenav */
| + | |
| − | font-size: 20px; /* Increased text to enable scrolling */
| + | |
| − | min-width: 750px;
| + | |
| − | background-color: white;
| + | |
| − | padding-top: 20px;
| + | |
| − | padding-left: 50px;
| + | |
| − | padding-right: 50px;
| + | |
| − | line-height: 1.6;
| + | |
| − | }
| + | |
| − | | + | |
| − | table {
| + | |
| − | border-collapse: collapse;
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | | + | |
| − | th {
| + | |
| − | padding: 8px;
| + | |
| − | border-bottom: 1px solid #ddd;
| + | |
| − | }
| + | |
| − | | + | |
| − | td {
| + | |
| − | vertical-align: middle;
| + | |
| − | border-bottom: 1px solid #ddd;
| + | |
| − | }
| + | |
| − | | + | |
| − | tr:hover {background-color:#f5f5f5;}
| + | |
| − | </style>
| + | |
| − | <body>
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | <div class="head">
| + | |
| − | | + | |
| − | <font size="7" color="#707070"><B>
| + | |
| − | Parts Overview
| + | |
| − | </B></font>
| + | |
| − | <br>
| + | |
| − | <br><br><br><br><br><br><br><br><br>
| + | |
| − | | + | |
| − | | + | |
| − | </div>
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | <div class="main">
| + | |
| − | <button onclick="topFunction()" id="myBtn" title="Go to top">Top</button>
| + | |
| − | | + | |
| − | <table>
| + | |
| − | <tr>
| + | |
| − | <th width="160px">Name</th>
| + | |
| − | <th width="100">Type</th>
| + | |
| − | <th>Description</th>
| + | |
| − | </tr>
| + | |
| − | <tr>
| + | |
| − | <td align="center">
| + | |
| − | <a href="http://parts.igem.org/Part:BBa_K3219001">BBa_K3219001</a></td>
| + | |
| − | <td align="center">Coding</td>
| + | |
| − | <td>sgRNA for mcyB Microcystis Aeruginosa UTEX 2388</i> (CgMT)</td>
| + | |
| − | </tr>
| + | |
| − | <tr>
| + | |
| − | <td align="center">
| + | |
| − | <a href="http://parts.igem.org/Part:BBa_K3219002">BBa_K3219002</a></td>
| + | |
| − | <td align="center">Coding</td>
| + | |
| − | <td>Plasmid for in vivo expression of dCas9-sgRNA targeting mcyB</i></td>
| + | |
| − | </tr>
| + | |
| − | <tr>
| + | |
| − | <td align="center">
| + | |
| − | | + | |
| − | </tr>
| + | |
| − | </table>
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | <br><br><br><br><br><br>
| + | |
| − | | + | |
| − | <script>
| + | |
| − | /* Loop through all dropdown buttons to toggle between hiding and showing its dropdown content - This allows the user to have multiple dropdowns without any conflict */
| + | |
| − | var dropdown = document.getElementsByClassName("dropdown-btn");
| + | |
| − | var i;
| + | |
| − | | + | |
| − | for (i = 0; i < dropdown.length; i++) {
| + | |
| − | dropdown[i].addEventListener("click", function() {
| + | |
| − | this.classList.toggle("active");
| + | |
| − | var dropdownContent = this.nextElementSibling;
| + | |
| − | if (dropdownContent.style.display === "block") {
| + | |
| − | dropdownContent.style.display = "none";
| + | |
| − | } else {
| + | |
| − | dropdownContent.style.display = "block";
| + | |
| − | }
| + | |
| − | });
| + | |
| − | }
| + | |
| − | | + | |
| − | //Get the button:
| + | |
| − | mybutton = document.getElementById("myBtn");
| + | |
| − | | + | |
| − | // When the user scrolls down 20px from the top of the document, show the button
| + | |
| − | window.onscroll = function() {scrollFunction()};
| + | |
| − | | + | |
| − | function scrollFunction() {
| + | |
| − | if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
| + | |
| − | mybutton.style.display = "block";
| + | |
| − | } else {
| + | |
| − | mybutton.style.display = "none";
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | // When the user clicks on the button, scroll to the top of the document
| + | |
| − | function topFunction() {
| + | |
| − | document.body.scrollTop = 0; // For Safari
| + | |
| − | document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
| + | |
| − | }
| + | |
| − | </script>
| + | |
| − | </body>
| + | |
| − | | + | |
| − | | + | |
| | <html> | | <html> |
| | </div> | | </div> |
