|
|
Line 1: |
Line 1: |
− | <html>
| |
| | | |
− | <head>
| |
− |
| |
− | <link rel="stylesheet" type="text/css" href="https://2018.igem.org/Team:FSU/CSS?action=raw&ctype=text/css" />
| |
− |
| |
− | </head>
| |
− |
| |
− | <body>
| |
− |
| |
− | <!-- Navbar -->
| |
− | <div class="topnav" id="myTopnav">
| |
− | <div class="headerLogo">
| |
− | <a href="test.html"><img src="header-banner-01.png" style="float:left;width:317px;"></img></a>
| |
− | </div> <!-- end of headerLogo -->
| |
− | <div class="menuItems">
| |
− | <li class="hvr-reveal active"><a href="test.html">Home</li></a>
| |
− | <li class="hvr-reveal"><a href="problem.html">Problem</a></li>
| |
− | <li class="hvr-reveal"><a href="solution.html">Solution</a></li>
| |
− | <li class="hvr-reveal"><a href="parts.html">Parts</a></li>
| |
− | <li class="hvr-reveal"><a href="human.html">Human Practice</a></li>
| |
− | <li style="padding:0;">
| |
− | <div class="dropdown" style="margin:0;">
| |
− | <button class="dropbtn hvr-reveal">People
| |
− | <span style="font-size:12px">▼</span>
| |
− | </button>
| |
− | <div class="dropdown-content" style="margin:0;">
| |
− | <ul><a class="hvr-reveal" href="people.html">Team</a></ul>
| |
− | <ul><a class="hvr-reveal" href="#">Link 2</a></ul>
| |
− | <ul><a class="hvr-reveal" href="#">Link 3</a></ul>
| |
− | </div>
| |
− | </div></li>
| |
− | <li class="hvr-reveal"><a href="judge.html">Juding Form</a></li>
| |
− | <a href="javascript:void(0);" style="font-size:15px;" class="icon" onclick="myFunction()">☰</a>
| |
− | </div> <!-- end of menuItems -->
| |
− | </div> <!-- end of topnav -->
| |
− |
| |
− | <script>
| |
− | function myFunction() {
| |
− | var x = document.getElementById("myTopnav");
| |
− | if (x.className === "topnav") {
| |
− | x.className += " responsive";
| |
− | } else {
| |
− | x.className = "topnav";
| |
− | }
| |
− | }
| |
− | </script>
| |
− |
| |
− | <!-- End of Navbar -->
| |
− |
| |
− | <!-- Slideshow
| |
− | <div class="slideshow-container" style="margin-top:100px">
| |
− |
| |
− | <!-- images
| |
− | <div class="mySlides fade">
| |
− | <div class="numbertext">1 / 3</div>
| |
− | <img src="images/pic1.jpg" style="width:100%">
| |
− | <div class="text">Caption One</div>
| |
− | </div>
| |
− |
| |
− | <div class="mySlides fade">
| |
− | <div class="numbertext">2 / 3</div>
| |
− | <img src="images/pic2.jpg" style="width:100%">
| |
− | <div class="text">Caption Two</div>
| |
− | </div>
| |
− |
| |
− | <div class="mySlides fade">
| |
− | <div class="numbertext">3 / 3</div>
| |
− | <img src="images/pic3.jpg" style="width:100%">
| |
− | <div class="text">Caption Three</div>
| |
− | </div>
| |
− |
| |
− | </div> <!-- slideshow-container -->
| |
− | <br>
| |
− |
| |
− |
| |
− | <!-- javascript -->
| |
− | <script>
| |
− | var slideIndex = 0;
| |
− | showSlides();
| |
− |
| |
− | // thumbnail image controls
| |
− |
| |
− | function currentSlide(n){
| |
− | showSlides(slideIndex = n);
| |
− | }
| |
− |
| |
− | function showSlides() {
| |
− | var i;
| |
− | var slides = document.getElementsByClassName("mySlides");
| |
− | var dots = document.getElementsByClassName("dot");
| |
− | for (i = 0; i < slides.length; i++) {
| |
− | slides[i].style.display = "none";
| |
− | }
| |
− | slideIndex++;
| |
− | if (slideIndex > slides.length) {slideIndex = 1}
| |
− | for (i = 0; i < dots.length; i++) {
| |
− | dots[i].className = dots[i].className.replace(" active", "");
| |
− | }
| |
− | slides[slideIndex-1].style.display = "block";
| |
− | dots[slideIndex-1].className += " active";
| |
− | setTimeout(showSlides, 4000); // Change image every 2 seconds
| |
− | }
| |
− |
| |
− | </script>
| |
− | <!-- End of Slideshow -->
| |
− |
| |
− | </body>
| |
− |
| |
− |
| |
− | </html>
| |