Team:Hong Kong HKU

From 2014.igem.org

(Difference between revisions)
 
(115 intermediate revisions not shown)
Line 82: Line 82:
     top: 0;
     top: 0;
     left: -11.5rem;
     left: -11.5rem;
-
     width: 15.5rem;
+
     width: 15.4rem;
     height: 100%;
     height: 100%;
     padding: 0;
     padding: 0;
Line 116: Line 116:
#menu ul {
#menu ul {
-
     margin: 0.5rem 0 1rem 0.5rem;
+
     margin: 0.5rem 1rem 0.5rem;
}
}
Line 130: Line 130:
.main-menu>li {
.main-menu>li {
     cursor: pointer;
     cursor: pointer;
-
     color: #9814FF;
+
     color: #369CF5;
     font-size: 1.2rem;
     font-size: 1.2rem;
}
}
.sub-menu {
.sub-menu {
-
     font-size: 0.9rem;
+
     font-size: 0.8rem;
-
     overflow: hidden;
+
     overflow-y: auto;
-
     transition: 0.25s;
+
     transition: 0.5s;
}
}
.sub-menu>li {
.sub-menu>li {
     display: block;
     display: block;
-
     padding: 0.3rem 0.4rem 0.4rem 0.3rem;
+
     padding: 0.3rem 0.4rem 0.4rem 0.08rem;
-
     color: blue;
+
     color: #0791DB;
     text-decoration: none;
     text-decoration: none;
-
     transition: 0.25s;
+
     transition: 0.5s;
}
}
Line 154: Line 154:
#sponsor {
#sponsor {
     position: fixed;
     position: fixed;
-
     height: 6rem;
+
     height: 6.1rem;
     width: 100%;
     width: 100%;
     left: 0;
     left: 0;
     bottom: -5rem;
     bottom: -5rem;
-
     background: #EC9D75;
+
     background: #67D9EB;
-
     transition: 0.5s;
+
     transition: 0.75s;
     z-index: 10;
     z-index: 10;
}
}
Line 215: Line 215:
     font-size: 2rem;
     font-size: 2rem;
     cursor: pointer;
     cursor: pointer;
-
     opacity: 0.6;
+
     opacity: 0.7;
     transition: 0.25s;
     transition: 0.25s;
     text-align: center;
     text-align: center;
Line 241: Line 241:
<body>
<body>
<div id="background">
<div id="background">
-
 
     <div id="present-window">
     <div id="present-window">
         <div id="pages">
         <div id="pages">
             <ul>
             <ul>
-
                <li class="page">
 
                 <style>
                 <style>
                 .vertical-align-wrapper {
                 .vertical-align-wrapper {
Line 274: Line 272:
                 }
                 }
                 </style>
                 </style>
-
                 <div class="page-content">
+
                 <li class="page">
-
                    Testing
+
                     <div class="page-content">
-
                     <div class="vertical-align-wrapper">
+
                         <div class="vertical-align-wrapper">
-
                         <div class="vertical-align">
+
                             <!-- Adjust position by yourself -->
-
                             <img src="https://static.igem.org/mediawiki/2014/e/e2/Front_page_1_00000.jpg" alt="" style="width:800px;height:600px"/>
+
                            <style>
 +
                            #image-wrapper {
 +
                                position: relative;
 +
                                width: 1102px;
 +
                                height: 620px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/4/4a/Front_Page_0_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
 
 +
                            #word-on-image {
 +
                                position: ;
 +
                                left: 30%;
 +
                                top: 80%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            </div>
                         </div>
                         </div>
                     </div>
                     </div>
-
                </div>
 
                 </li>
                 </li>
                 <li class="page">
                 <li class="page">
-
                     Still testing...
+
                     <div class="page-content">
-
                    <div class="vertical-align-wrapper">
+
                       
-
                        <div class="vertical-align">
+
                        <div class="vertical-align-wrapper">
-
                            <h1>Strive for excellence.</h1>
+
                            <style>
 +
                            #image-wrapper1 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/9/98/Background_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button10 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper1" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button10">
 +
                                <button onclick="myFunction10()">Details</button>
 +
                                <script>
 +
                                function myFunction10() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/background");
 +
                                }
 +
                                </script>
 +
                                </div>
 +
                            </div>
                         </div>
                         </div>
                     </div>
                     </div>
                 </li>
                 </li>
                 <li class="page">
                 <li class="page">
-
              Page3
+
                     <div class="page-content">
-
                     <div class="vertical-align-wrapper">
+
                 
-
                         <div class="vertical-align">
+
                         <div class="vertical-align-wrapper">
-
                            <iframe src="https://www.google.com/calendar/embed?height=600&amp;wkst=1&amp;bgcolor=%23ccccff&amp;src=mo3tc52c5ck375q73lubq5k2vc%40group.calendar.google.com&amp;color=%23333333&amp;ctz=Asia%2FHong_Kong" style=" border-width:0 " width="800" height="600" frameborder="0" scrolling="no"></iframe>
+
                        <style>
 +
                            #image-wrapper2 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/5/53/Products_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                        #detail-button12 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                        }
 +
                        </style>
 +
                            <div id="image-wrapper2" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button12">
 +
                                <button onclick="myFunction12()">Details</button>
 +
                                    <script>
 +
                                function myFunction12() {
 +
                                    alert("To provide an answer to the above two listed questions, we he proudly present two of our products: (1) a methodology for convenient purification of the affinity tagged-Eut BMC, and; (2) a plasmid that allows efficient and rigorous cloning and modification of the BMC-cargo system for expression and various experiments. For their detailed information please check the lab results pages: BMC-Cargo co-purification, and Plasmid Design.");
 +
                                }
 +
                                    </script>
 +
                                </div>
 +
                            </div>
                         </div>
                         </div>
                     </div>
                     </div>
                 </li>
                 </li>
                 <li class="page">
                 <li class="page">
-
              Page4
+
                    <div class="page-content">
-
            <button onclick="myFunction()">Card Games</button>
+
                       
-
            <script>
+
                        <div class="vertical-align-wrapper">
-
        function myFunction() {
+
                            <style>
-
            window.open("https://2014.igem.org/Team:Hong_Kong_HKU/cardgame");
+
                            #image-wrapper3 {
-
        }
+
                                position: relative;
-
            </script>
+
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/a/a2/Team_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button11 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper3" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button11">
 +
                                <button onclick="myFunction11()">Details</button>
 +
                                <script>
 +
                                function myFunction11() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/team");
 +
                                }
 +
                                </script>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </div>
                 </li>
                 </li>
                 <li class="page">
                 <li class="page">
-
                <img src="https://static.igem.org/mediawiki/2014/e/e2/Front_page_1_00000.jpg" alt="" style="width:800px;height:600px"/>
+
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper5 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/9/93/Lab_results_1_front_page_00005.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper5" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            </div>
 +
                        </div>
 +
                    </div>
                 </li>
                 </li>
                 <li class="page">
                 <li class="page">
-
                <div class="page-content">Page6</div>
+
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper6 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/b/bb/Lab_results_2_Cloning_page_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button0 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper6" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button0">
 +
                                <button onclick="myFunction0()">Details</button>
 +
                                <script>
 +
                                function myFunction0() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/cloning");
 +
                                }
 +
                                </script>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </div>
                 </li>
                 </li>
                 <li class="page">
                 <li class="page">
-
                <div class="page-content">Page7</div>
+
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper7 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/0/07/Lab_results_Protein_expression_00047.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button1 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper7" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button1">
 +
                                    <button onclick="myFunction1()">Details</button>
 +
                                    <script>
 +
                                    function myFunction1() {
 +
                                        window.open("https://2014.igem.org/Team:Hong_Kong_HKU/proteinexpression");
 +
                                    }
 +
                                    </script>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </div>
                 </li>
                 </li>
                 <li class="page">
                 <li class="page">
-
                <div class="page-content">Page8</div>
+
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper8 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/7/76/Lab_results_Expression_optimization_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button2 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper8" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button2">
 +
                                <button onclick="myFunction2()">Details</button>
 +
                                <script>
 +
                                function myFunction2() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/expressionoptimization");
 +
                                }
 +
                                </script>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </div>
                 </li>
                 </li>
                 <li class="page">
                 <li class="page">
-
                <div class="page-content">Page9</div>
+
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper9 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/4/47/Lab_results_BMC_purification_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button3 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper9" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button3">
 +
                                <button onclick="myFunction3()">Details</button>
 +
                                <script>
 +
                                function myFunction3() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/BMCpurification");
 +
                                }
 +
                                </script>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </div>
                 </li>
                 </li>
                 <li class="page">
                 <li class="page">
-
                 <div class="page-content">Page10</div>
+
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper10 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/7/74/Lab_results_Cargo_localization_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button4 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper10" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button4">
 +
                                <button onclick="myFunction4()">Details</button>
 +
                                <script>
 +
                                function myFunction4() {
 +
                                    alert("pETES was constructed from pETE as described in previous sections. Afterwards, mCherry was PCR-ed from BBa_J06702 and cloned into pETES downstream to and in-frame with the signal peptide. The .dna file is available online for the readers' reference, and the general cloning experimental protocols are available in the Methods and Protocols page.");
 +
                                }
 +
                                </script>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                 </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper11 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/b/b7/Lab_results_BMC-Cargo_co-purification_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button5 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                                <div id="image-wrapper11" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button5">
 +
                                <button onclick="myFunction5()">Details</button>
 +
                                <script>
 +
                                function myFunction5() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/BMCcargocopurification");
 +
                                }
 +
                                </script>
 +
                                </div>   
 +
                        </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper12 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/0/08/Lab_results_confocal_microscopy_00029.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button6 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper12" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button6">
 +
                                <button onclick="myFunction6()">Details</button>
 +
                                <script>
 +
                                function myFunction6() {
 +
                                    alert("BL21(DE3) carrying the pETES-mCherry plasmid, as well as the control, which are DH10β cells carrying a pCR2.1-mCherry plasmid, were streaked on a solid medium. Pink colonies, indicating the expression of mCherry, was picked and suspended in a drop of water on a glass slide, and imaged using Olympus Fluoview FV1000 Confocal Laser Scanning Biological Microscope.");
 +
                                }
 +
                                </script>
 +
                                </div>   
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper13 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/c/cd/Lab_results_TEM_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button7 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper13" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button7">
 +
                                <button onclick="myFunction7()">Details</button>
 +
                                <script>
 +
                                function myFunction7() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/TEM");
 +
                                }
 +
                                </script>
 +
                                </div> 
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper14 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/e/ea/Lab_results_Plasmid_design_00037.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button8 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper14" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button8">
 +
                                <button onclick="myFunction8()">Details</button>
 +
                                <script>
 +
                                function myFunction8() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/plasmidesign");
 +
                                }
 +
                                </script>
 +
                                </div> 
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper15 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/5/5f/Lab_results_Plasmid_construction_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button9 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper15" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button9">
 +
                                <button onclick="myFunction9()">Details</button>
 +
                                <script>
 +
                                function myFunction9() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/plasmidconstruction");
 +
                                }
 +
                                </script>
 +
                                </div> 
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper16 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/2/21/Human_Practice_front_page_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper16" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                        <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper17 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/d/da/Human_Practice_card_game_00079.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button18 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper17" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button18">
 +
                                <button onclick="myFunction18()">Details</button>
 +
                                <script>
 +
                                function myFunction18() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/cardgame");
 +
                                }
 +
                                </script>
 +
                            </div>
 +
                            </div>
 +
                        </div>
 +
                </li>
 +
                <li class="page">
 +
                <div class="page-content">
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper30 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/1/15/Human_Practice_School_tour_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button17 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                        <div id="image-wrapper30" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            <div id="detail-button17">
 +
                                <button onclick="myFunction17()">Details</button>
 +
                                <script>
 +
                                function myFunction17() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/schooltour");
 +
                                }
 +
                                </script>
 +
                            </div>
 +
                        </div>
 +
                        </div>
 +
                </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper18 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/8/8d/Human_Practice_Biotechnological_course_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                        #detail-button14 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                        }
 +
                        </style>
 +
                        <div id="image-wrapper18" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            <div id="detail-button14">
 +
                                <button onclick="myFunction14()">Details</button>
 +
                                <script>
 +
                                function myFunction14() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/biotechcourse");
 +
                                }
 +
                                </script>
 +
                            </div>
 +
                        </div>
 +
                        </div> 
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper20 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/a/ae/Biobricks_front_page_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper20" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper22 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/e/e9/Others_front_page_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper22" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper23 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/d/dd/Safety_page_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper23" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper24 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/9/9e/Lab_note_page_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            #detail-button13 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper24" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                                <div id="detail-button13">
 +
                                <button onclick="myFunction13()">Details</button>
 +
                                <script>
 +
                                function myFunction13() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/laboratorynotes");
 +
                                }
 +
                                </script>
 +
                                </div> 
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                        <style>
 +
                        #image-wrapper25 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/9/9a/Methods_and_Protocols_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                        }
 +
                        #detail-button15 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                        }
 +
                        </style>
 +
                        <div id="image-wrapper25" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            <div id="detail-button15">
 +
                                <button onclick="myFunction15()">Details</button>
 +
                                <script>
 +
                                function myFunction15() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/methodsnprotocols");
 +
                                }
 +
                                </script>
 +
                            </div>
 +
                        </div>
 +
                        </div> 
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                        <style>
 +
                        #image-wrapper26 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/4/4a/References_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                        }
 +
                        #detail-button16 {
 +
                                position: ;
 +
                                right: 10%;
 +
                                bottom: 10%;
 +
                                font-size: 50px;
 +
                                color: red;
 +
                        }
 +
                        </style>
 +
                        <div id="image-wrapper26" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            <div id="detail-button16">
 +
                                <button onclick="myFunction16()">Details</button>
 +
                                <script>
 +
                                function myFunction16() {
 +
                                    window.open("https://2014.igem.org/Team:Hong_Kong_HKU/references");
 +
                                }
 +
                                </script>
 +
                            </div>
 +
                        </div> 
 +
                    </div>
 +
                    </div>
 +
                </li>
 +
                <li class="page">
 +
                    <div class="page-content">
 +
                       
 +
                        <div class="vertical-align-wrapper">
 +
                            <style>
 +
                            #image-wrapper27 {
 +
                                position: relative;
 +
                                width: 973px;
 +
                                height: 547px;
 +
                                background-image: url(https://static.igem.org/mediawiki/2014/6/6d/Acknowledgement_00000.jpg);
 +
                                background-size: 100% 100%;
 +
                            }
 +
                            </style>
 +
                            <div id="image-wrapper27" style="max-width:100%; max-height:100%" class="vertical-align">
 +
                            </div>
 +
                        </div>
 +
                    </div>
                 </li>
                 </li>
             </ul>
             </ul>
         </div>
         </div>
         <div id="present-prev-page">
         <div id="present-prev-page">
-
             <span class="page-nav-icon">&lt;</span>
+
             <span class="page-nav-icon"><img src="https://static.igem.org/mediawiki/2014/f/f5/Left_Arrow_Transparent_bg_new_00000.png" width="50px"/></span>
         </div>
         </div>
         <div id="present-next-page">
         <div id="present-next-page">
-
             <span class="page-nav-icon">&gt;</span>
+
             <span class="page-nav-icon"><img src="https://static.igem.org/mediawiki/2014/0/0b/Right_Arrow_Tranparent_bg_new_00000.png" width="50px"/></span>
         </div>
         </div>
     </div>
     </div>
Line 338: Line 1,042:
     <div id="menu">
     <div id="menu">
         <div id="menu-title">
         <div id="menu-title">
-
             HKU iGEM 2014
+
             <img src="https://static.igem.org/mediawiki/2014/d/dc/HKU_iGEM_2014_Transparent_bg_00000.png" height="55px">
             <a href="https://2014.igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a>
             <a href="https://2014.igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a>
         </div>
         </div>
Line 349: Line 1,053:
             <span class="title">Introduction</span>
             <span class="title">Introduction</span>
             <ul class="sub-menu">
             <ul class="sub-menu">
-
                 <li class="menu-button" data-page=0>M1: Phosphate Removal</li>
+
                 <li class="menu-button" data-page=0></li>
-
                 <li class="menu-button" data-page=1>M2: Polyphosphate Kinase</li>
+
                 <li class="menu-button" data-page=1>Background</li>
-
                 <li class="menu-button" data-page=2>M3: Micro-compartment</li>
+
                 <li class="menu-button" data-page=2>Products</li>
-
                 <li class="menu-button" data-page=3>Modelling</li>
+
                 <li class="menu-button" data-page=3>Team</li>
-
                <li class="menu-button" data-page=4>References</li>
+
             </ul>
             </ul>
             </li>
             </li>
Line 359: Line 1,062:
             <span class="title">Lab Results</span>
             <span class="title">Lab Results</span>
             <ul class="sub-menu">
             <ul class="sub-menu">
-
                 <li class="menu-button" data-page=5>Lab Safety</li>
+
                 <li class="menu-button" data-page=4>Lab results</li>
-
                 <li class="menu-button" data-page=6>Public Promotion</li>
+
                <li class="menu-button" data-page=5>Molecular cloning</li>
-
                 <li class="menu-button" data-page=7>Public Promotion</li>
+
                 <li class="menu-button" data-page=6>Protein expression</li>
-
                 <li class="menu-button" data-page=8>Collaborations</li>
+
                 <li class="menu-button" data-page=7>Expression optimization</li>
-
                 <li class="menu-button" data-page=9>Future Applications</li>
+
                 <li class="menu-button" data-page=8>BMC purification</li>
 +
                 <li class="menu-button" data-page=9>Cargo localization</li>
 +
                <li class="menu-button" data-page=10>BMC-cargo co-purification</li>
 +
                <li class="menu-button" data-page=11>Confocal microscopy</li>
 +
                <li class="menu-button" data-page=12>Transmission electron microscopy</li>
 +
                <li class="menu-button" data-page=13>Plasmid design</li>
 +
                <li class="menu-button" data-page=14>Plasmid construction</li>
             </ul>
             </ul>
             </li>
             </li>
             <li>
             <li>
-
             <span class="title">Human Practise</span>
+
             <span class="title">Human Practice</span>
             <ul class="sub-menu">
             <ul class="sub-menu">
-
                 <li class="menu-button" data-page=0>BioBricks</li>
+
                 <li class="menu-button" data-page=15>Human Practice</li>
-
                 <li class="menu-button" data-page=0>Results</li>
+
                 <li class="menu-button" data-page=16>Card game</li>
-
                 <li class="menu-button" data-page=0>Judging Criteria</li>
+
                 <li class="menu-button" data-page=17>School tour</li>
 +
                <li class="menu-button" data-page=18>Biotechnological course</li>
             </ul>
             </ul>
             </li>
             </li>
             <li>
             <li>
-
             <span class="title">Biobrick</span>
+
             <span class="title">Biobrick and Others</span>
             <ul class="sub-menu">
             <ul class="sub-menu">
-
                 <li class="menu-button" data-page=0>Protocols</li>
+
                 <li class="menu-button" data-page=19>Biobrick submission</li>
-
                 <li class="menu-button" data-page=0>Lab Note - Our Diary</li>
+
                 <li class="menu-button" data-page=20>Others</li>
-
                 <li class="menu-button" data-page=0>Photo Gallery</li>
+
                 <li class="menu-button" data-page=21>Safety notes</li>
-
            </ul>
+
                 <li class="menu-button" data-page=22>Laboratory notes</li>
-
            </li>
+
                 <li class="menu-button" data-page=23>Methods and Protocols</li>
-
            <li>
+
                 <li class="menu-button" data-page=24>References</li>
-
            <span>References</span>
+
                 <li class="menu-button" data-page=25>Acknowledgement</li>
-
            <ul class="sub-menu">
+
-
                 <li class="menu-button" data-page=0>Our Profile</li>
+
-
                 <li class="menu-button" data-page=0>People</li>
+
-
                 <li class="menu-button" data-page=0>Attributions</li>
+
-
                 <li class="menu-button" data-page=0>Supporters</li>
+
-
            </ul>
+
-
            </li>
+
-
<li>
+
-
            <span>Acknowledgement</span>
+
-
            <ul class="sub-menu">
+
-
                <li class="menu-button" data-page=0>Our Profile</li>
+
-
                <li class="menu-button" data-page=0>People</li>
+
-
                <li class="menu-button" data-page=0>Attributions</li>
+
-
                <li class="menu-button" data-page=0>Supporters</li>
+
             </ul>
             </ul>
             </li>
             </li>
Line 404: Line 1,100:
     <div id="sponsor">
     <div id="sponsor">
 +
        <!-- Change Wiki default buttons style here -->
 +
        <style>
 +
        #top-section {
 +
            border: none;
 +
        }
 +
 +
        #menubar {
 +
            position: relative;
 +
            top: 0;
 +
            left: 0;
 +
            width: auto;
 +
        }
 +
 +
        #menubar ul {
 +
            color: red;
 +
        }
 +
 +
        #p-logo {
 +
            display: none;
 +
        }
 +
        #search-controls {
 +
            display:none;
 +
        }
 +
        </style>
     </div>
     </div>
</div>
</div>
Line 451: Line 1,171:
         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 = '18rem';
         } else {
         } else {
             sub_menu.style.height = '0';
             sub_menu.style.height = '0';
Line 477: Line 1,197:
     }
     }
  };
  };
 +
 +
var sponsor = document.querySelector("#sponsor");
 +
var top_section = document.querySelector("#top-section");
 +
if (top_section !== null) {
 +
    sponsor.appendChild(top_section);
 +
}
})();
})();
</script>
</script>

Latest revision as of 03:50, 18 October 2014

<!DOCTYPE html> HKU IGEM Team

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