Weronika77 (Talk | contribs) |
Weronika77 (Talk | contribs) |
||
Line 32: | Line 32: | ||
} | } | ||
+ | #myInput { | ||
+ | box-sizing: border-box; | ||
+ | background-image: url('searchicon.png'); | ||
+ | background-position: 14px 12px; | ||
+ | background-repeat: no-repeat; | ||
+ | font-size: 16px; | ||
+ | padding: 14px 20px 12px 45px; | ||
+ | border: none; | ||
+ | border-bottom: 1px solid #ddd; | ||
+ | } | ||
+ | |||
+ | #myInput:focus {outline: 3px solid #ddd;} | ||
</style> | </style> | ||
</head> | </head> | ||
Line 134: | Line 146: | ||
</div> | </div> | ||
</div> | </div> | ||
+ | |||
+ | <div class="dropdowntu"> | ||
+ | <button onclick="myFunction()" class="dropbtn">Search!</button> | ||
+ | <div id="myDropdown" class="dropdown-content"> | ||
+ | <input type="text" placeholder="Search.." id="myInput" onkeyup="filterFunction()"> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft">Home</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Description">Description</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Design">Design</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Results">Results</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Demonstrate">Demonstrate</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Experiments">Experiments Protocols</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Safety">Safety</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Notebook">Notebook</a> | ||
+ | <a href="Modeling">Modeling</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Model#Kinetics">Reaction Kinetics</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Model#CodonUsage">Codon Harmonization</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Parts">Parts</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Human_Prediction">Human Practices</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Public_Engagement">Education & Engagement </a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Test">Team</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Collaborations">Collaborations</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Attributions">Attributions</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Sponsors">Sponsors</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/">Judging Form</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Medals">Medal Requirements</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Public_Engagement">Foldscope Event</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Public_Engagement">Global Meeting Point</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Design#moclo">Modular Cloning (MoClo)</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Model">TALE</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Design">phi29</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Desgin">Orthogonality</a> | ||
+ | <a href="https://2019.igem.org/Team:TUDelft/Description">Inspiration</a> | ||
+ | </div> | ||
+ | </div> | ||
<a class="social" href="mailto:igem@tudelft.nl"><img id="social" src="https://static.igem.org/mediawiki/2019/b/b4/T--TUDELFT--mailicon.png" alt="Email" /></a> | <a class="social" href="mailto:igem@tudelft.nl"><img id="social" src="https://static.igem.org/mediawiki/2019/b/b4/T--TUDELFT--mailicon.png" alt="Email" /></a> | ||
Line 149: | Line 195: | ||
</div> | </div> | ||
+ | <script> | ||
+ | <script> | ||
+ | /* When the user clicks on the button, | ||
+ | toggle between hiding and showing the dropdown content */ | ||
+ | function myFunction() { | ||
+ | document.getElementById("myDropdown").classList.toggle("show"); | ||
+ | } | ||
+ | |||
+ | function filterFunction() { | ||
+ | var input, filter, ul, li, a, i; | ||
+ | input = document.getElementById("myInput"); | ||
+ | filter = input.value.toUpperCase(); | ||
+ | div = document.getElementById("myDropdown"); | ||
+ | a = div.getElementsByTagName("a"); | ||
+ | for (i = 0; i < a.length; i++) { | ||
+ | txtValue = a[i].textContent || a[i].innerText; | ||
+ | if (txtValue.toUpperCase().indexOf(filter) > -1) { | ||
+ | a[i].style.display = ""; | ||
+ | } else { | ||
+ | a[i].style.display = "none"; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | </script> | ||
+ | </script> | ||
</body> | </body> | ||
</html> | </html> |
Revision as of 00:25, 22 October 2019