Team:Hong Kong HKU

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<!DOCTYPE html>
 
<html>
<html>
<meta charset="UTF-8">
<meta charset="UTF-8">
Line 130: Line 129:
.sub-menu {
.sub-menu {
-
     font-size: 0.9rem;
+
     font-size: 1rem;
     overflow: hidden;
     overflow: hidden;
     transition: 0.25s;
     transition: 0.25s;
Line 229: Line 228:
         <ul>
         <ul>
             <li class="page">
             <li class="page">
-
            <style>
+
                <style>
-
            #page-1 {
+
                #page-1 {
-
                font-size: 100px;
+
                    font-size: 100px;
-
            }
+
                }
-
            </style>
+
                </style>
-
            <div class="page-content" id="page-1">Page1</div>
+
                <div class="page-content" id="page-1">Page1</div>
             </li>
             </li>
             <li class="page">
             <li class="page">
-
            <div class="page-content">Page2</div>
+
                <div class="page-content">Page2</div>
             </li>
             </li>
             <li class="page">
             <li class="page">
-
            <div class="page-content">Page3</div>
+
                <div class="page-content">Page3</div>
             </li>
             </li>
             <li class="page">
             <li class="page">
-
            <div class="page-content">Page4</div>
+
                <div class="page-content">Page4</div>
             </li>
             </li>
             <li class="page">
             <li class="page">
-
            <div class="page-content">Page5</div>
+
                <div class="page-content">Page5</div>
             </li>
             </li>
             <li class="page">
             <li class="page">
-
            <div class="page-content">Page6</div>
+
                <div class="page-content">Page6</div>
             </li>
             </li>
             <li class="page">
             <li class="page">
-
            <div class="page-content">Page7</div>
+
                <div class="page-content">Page7</div>
             </li>
             </li>
             <li class="page">
             <li class="page">
-
            <div class="page-content">Page8</div>
+
                <div class="page-content">Page8</div>
             </li>
             </li>
             <li class="page">
             <li class="page">
-
            <div class="page-content">Page9</div>
+
                <div class="page-content">Page9</div>
             </li>
             </li>
             <li class="page">
             <li class="page">
-
            <div class="page-content">Page10</div>
+
                <div class="page-content">Page10</div>
             </li>
             </li>
         </ul>
         </ul>
Line 335: Line 334:
<script>
<script>
-
(function() {
+
var pages = document.querySelectorAll(".page");
-
     function AND(a,b) {
+
var page_current = 0;
-
         if (a) {
+
function pageJumpTo(to_page) {
-
             if (b) {
+
     if (to_page >= 0 && to_page < pages.length) {
-
                return true;
+
         for (var i = 0; i < pages.length; i++) {
-
            }
+
             pages[i].style.left = 100*(i-to_page) + '%';
         }
         }
-
         return false;
+
         page_current = to_page;
     }
     }
-
    var pages = document.querySelectorAll(".page");
+
}
-
    var page_current = 0;
+
document.querySelector("#content-prev-page").onclick = function() {
-
    function pageJumpTo(to_page) {
+
    pageJumpTo(page_current - 1);
-
        if (AND(to_page >= 0, to_page < pages.length)) {
+
};
-
            for (var i = 0; i < pages.length; i++) {
+
document.querySelector("#content-next-page").onclick = function() {
-
                pages[i].style.left = 100*(i-to_page) + '%';
+
    pageJumpTo(page_current + 1);
-
            }
+
};
-
            page_current = to_page;
+
pageJumpTo(0);
-
        }
+
var buttons = document.querySelectorAll(".menu-button");
-
    }
+
function makeButton(page) {
-
    document.querySelector("#content-prev-page").onclick = function() {
+
    return function() {
-
        pageJumpTo(page_current - 1);
+
         pageJumpTo(page);
-
    };
+
-
    document.querySelector("#content-next-page").onclick = function() {
+
-
         pageJumpTo(page_current + 1);
+
     };
     };
-
    pageJumpTo(0);
+
}
-
    var buttons = document.querySelectorAll(".menu-button");
+
for (var i = 0; i < buttons.length; i++) {
-
    function makeButton(page) {
+
    var page = parseInt(buttons[i].getAttribute("data-page"));
-
        return function() {
+
    buttons[i].onclick = makeButton(page);
-
            pageJumpTo(page);
+
}
-
        };
+
-
    }
+
-
    for (var i = 0; i < buttons.length; i++) {
+
-
        var page = parseInt(buttons[i].getAttribute("data-page"));
+
-
        buttons[i].onclick = makeButton(page);
+
-
    }
+
-
    var main_menus = document.querySelectorAll("ul.main-menu>li");
+
var main_menus = document.querySelectorAll("ul.main-menu>li");
-
    function menuOpen(index) {
+
function menuOpen(index) {
-
        for (var i = 0; i < main_menus.length; i++) {
+
    for (var i = 0; i < main_menus.length; i++) {
-
            var sub_menu = main_menus[i].querySelector(".sub-menu");
+
        var sub_menu = main_menus[i].querySelector(".sub-menu");
-
            if (i === index) {
+
        if (i === index) {
-
                sub_menu.style.height = '10rem';
+
            sub_menu.style.height = '10rem';
-
            } else {
+
        } else {
-
                sub_menu.style.height = '0';
+
            sub_menu.style.height = '0';
-
            }
+
         }
         }
     }
     }
-
    function makeMenuOpenFunc(index) {
+
}
-
        return function() {
+
function makeMenuOpenFunc(index) {
-
            menuOpen(index);
+
    return function() {
-
        };
+
        menuOpen(index);
-
    }
+
    };
-
    for (var i = 0; i < main_menus.length; i++) {
+
}
-
        main_menus[i].onclick = makeMenuOpenFunc(i);
+
for (var i = 0; i < main_menus.length; i++) {
-
    }
+
    main_menus[i].onclick = makeMenuOpenFunc(i);
-
    menuOpen(0);
+
}
-
})();
+
menuOpen(0);
</script>
</script>
</body>
</body>
</html>
</html>

Revision as of 15:32, 19 August 2014

HKU IGEM Team

  • Page1
  • Page2
  • Page3
  • Page4
  • Page5
  • Page6
  • Page7
  • Page8
  • Page9
  • Page10
<
>

Retrieved from "http://2014.igem.org/Team:Hong_Kong_HKU"