Difference between revisions of "Team:NKU China"

Line 1: Line 1:
−
{{NKU_China/wiki}}
+
{{NKU_China/menubar}}
 
<html>
 
<html>
 
<head>
 
<head>
 
      
 
      
−
 
 
     <!--separatrix-->
 
     <!--separatrix-->
 
     <link rel="stylesheet" href="https://2016.igem.org/Template:NKU_China/css/wowslider/Home-team?action=raw&ctype=text/css">
 
     <link rel="stylesheet" href="https://2016.igem.org/Template:NKU_China/css/wowslider/Home-team?action=raw&ctype=text/css">
−
     <link rel="stylesheet" href="css/style.css">
+
 
 +
     <!--<link rel="stylesheet" href="css/style.css">-->
 
     <style>
 
     <style>
 
         main {
 
         main {
−
             width: 98vw;
+
             width:100vw;
−
            height: calc(100vh - 18px);
+
−
            position: relative;
+
−
        }
+
−
 
+
−
        .window {
+
−
            width: 4vw;
+
−
            height: 4vw;
+
−
            position: absolute;
+
−
        }
+
−
 
+
−
        #window1 ,#window4 .window-placeholder {
+
−
            left: 0;
+
−
            top: 0;
+
−
        }
+
−
 
+
−
        #window2 ,#window3 .window-placeholder {
+
−
            right: 0;
+
−
            top: 0;
+
−
        }
+
−
 
+
−
        #window3 ,#window2 .window-placeholder {
+
−
            left: 0;
+
−
            bottom: 0;
+
−
        }
+
−
 
+
−
        #window4 ,#window1 .window-placeholder {
+
−
            right: 0;
+
−
            bottom: 0;
+
−
            /*height:calc(100vh - 18px - 8vw);*/
+
−
        }
+
−
 
+
−
        .window > div {
+
−
           
+
−
        }
+
−
 
+
−
        .window-placeholder {
+
−
            width: 20px;
+
−
            height: 20px;
+
−
            position:absolute;
+
−
            z-index:15;
+
−
        }
+
−
 
+
−
        .window-placeholder img {
+
−
            width: 100%;
+
−
            height: 100%;
+
−
        }
+
−
 
+
−
        .window-content {
+
−
            width: 100%;
+
−
            height: 100%;
+
−
            display:none;
+
−
        }
+
−
 
+
−
        .window-content .p {
+
−
            padding:1rem;
+
 
         }
 
         }
  
 
         #wowslider-wrapper {
 
         #wowslider-wrapper {
−
             margin: auto;
+
             margin:0 auto;
 +
            height:90vh;
 +
            width:120vh;
 
         }
 
         }
  
 
         #wowslider-container1 {
 
         #wowslider-container1 {
−
             margin: 0;
+
             margin:0;
 
         }
 
         }
 
     </style>
 
     </style>
Line 82: Line 29:
 
             vh = $('#ruler').height();
 
             vh = $('#ruler').height();
 
         };
 
         };
−
 
−
        var exit_full_screen_png = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAP5JREFUeNrsV+0NgyAQPS4dwAkau4Ej2clko7pBSRexh6XmQpGPivCHl1w0fLz3QJADgLBcoaN4UEzgQag+po2uN1odWOKLicnTcYkwEOQw8TFhiTtN8I6RBrwc3ARS3ezgGb8E5jlCOmI4ZhFooCh6XiBeIEIzEOIwkMR1F9biCY70DwOwJ65fkBHrAgnnYxNfdR0jeO5MWY4ZUNT/xgvQsYf7E0ff27sDU9dABozcBBYW/zFxqSDOTTQ0NDSASP0RZTqOt5MRCx7DzmMZC+cCLSFpCUlyQqIyCCqfCfSIS/O95MEFt8exmtAzMPhW6oHdEcMx1L+c1r6evwUYACKt3Vlo4XE8AAAAAElFTkSuQmCC';
 
−
        var full_screen_png = 'data:image/png;base64,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'
 
−
 
−
        function window_after(win) {
 
−
            function window1_after() {
 
−
 
−
            };
 
−
            function window2_after() {
 
−
 
−
            };
 
−
            function window3_after() {
 
−
 
−
            };
 
−
            function window4_after() {
 
−
                var window_content = win.children('.window-content');
 
−
                if (window_content.width() / window_content.height() > 4 / 3) {
 
−
                    $('#wowslider-wrapper').height(window_content.height())
 
−
                    $('#wowslider-wrapper').width(window_content.height() / 3 * 4)
 
−
                }
 
−
                else {
 
−
                    $('#wowslider-wrapper').width(window_content.width())
 
−
                    $('#wowslider-wrapper').height(window_content.width() / 4 * 3)
 
−
                }
 
−
 
−
            };
 
−
 
−
            switch(win.attr('id')) {
 
−
                case "window1": window1_after();
 
−
                    break;
 
−
                case "window2": window2_after();
 
−
                    break;
 
−
                case "window3": window3_after();
 
−
                    break;
 
−
                case "window4": window4_after();
 
−
                    break;
 
−
            }
 
−
        };
 
−
 
−
        function log(message) {
 
−
            console.log(message);
 
−
        }
 
  
 
     </script>
 
     </script>
Line 129: Line 34:
  
 
         $(function () {
 
         $(function () {
−
            $('.window-placeholder img').attr('src', full_screen_png);
+
         
−
 
+
−
            calibrate_ruler();
+
−
            $(window).resize(calibrate_ruler)
+
−
 
+
−
            function open(win) {
+
−
                win.children('.window-placeholder').children('img').attr('src', exit_full_screen_png);
+
−
                win.children('.window-content').show();
+
−
                win.css('opacity', 0);
+
−
                win.animate({
+
−
                    width: '94vw',
+
−
                    height: 100*vh-4*vw-18,
+
−
                    opacity:1,
+
−
                }, 2000, function () {
+
−
                    window_after(win);
+
−
                });
+
−
            }
+
−
            function close(win) {
+
−
                win.animate({
+
−
                    width: '4vw',
+
−
                    height: '4vw',
+
−
                    opacity: 0,
+
−
                }, 2000, function () {
+
−
                    win.children('.window-placeholder').children('img').attr('src', full_screen_png);
+
−
                    win.children('.window-content').hide();
+
−
                    win.css('opacity', 1);
+
−
                });
+
−
               
+
−
            }
+
−
 
+
−
            open($('#window1'))
+
−
            close($('#window1'))
+
−
            setTimeout(function () { open($('#window2')); close($('#window2')) }, 4000)
+
−
            setTimeout(function () { open($('#window3')); close($('#window3')) }, 8000)
+
−
            setTimeout(function () { open($('#window4')); close($('#window4')) }, 12000)
+
−
            setTimeout(function () { open($('#window4')) }, 17000)
+
−
 
+
−
            $('.window-placeholder img').each(function (index, value) {
+
−
                $(value).click(function () {
+
−
                   
+
−
                    if($(value).attr('src') == full_screen_png )
+
−
                        open($('#window' + (index+1)))
+
−
                    else
+
−
                        close($('#window' + (index + 1)))
+
−
                })
+
−
               
+
−
 
+
−
            })
+
−
 
+
  
 
         })
 
         })
Line 184: Line 41:
 
<body>
 
<body>
 
     <div id="ruler" style="display:none;width:1vw;height:1vh;"></div>
 
     <div id="ruler" style="display:none;width:1vw;height:1vh;"></div>
−
   
 
 
     <main>
 
     <main>
−
         <div id="window1" class="window">
+
         <div id="wowslider-wrapper">
−
            <div class="window-placeholder"><img src=""></div>        
+
            <div id="wowslider-container1">
−
            <div class="window-content" style="background-color:aqua">
+
                <div class="ws_images">
−
                <div class="p" style="font-size:3rem">
+
                    <ul>
−
                     Project
+
                        <li><img src="https://static.igem.org/mediawiki/2016/d/dc/T--NKU_China--whole-group-4-3-1366.jpg" alt="Team" title="Team" id="wows1_0" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/f/fc/T--NKU_China--xiongyuxiu-4-3-1366.jpg" alt="Yuxiu Xiong" title="Yuxiu Xiong" id="wows1_1" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/1/19/T--NKU_China--chenchen-1366.jpg" alt="Chen Chen" title="Chen Chen" id="wows1_2" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/3/3a/T--NKU_China--liuxiao-4-3-1366.jpg" alt="Xiao Liu" title="Xiao Liu" id="wows1_3" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/b/be/T--NKU_China--dailiangti-1366.jpg" alt="Liangti Dai" title="Liangti Dai" id="wows1_4" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/a/a6/T--NKU_China--dongzhuoer-1366.jpg" alt="Zhuoer Dong" title="Zhuoer Dong" id="wows1_5" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/c/c6/T--NKU_China--zhaoxianglin-1366.jpg" alt="Xianglin Zhao" title="Xianglin Zhao" id="wows1_6" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/4/44/T--NKU_China--mengfankang-1366.jpg" alt="Fankang Meng" title="Fankang Meng" id="wows1_7" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/f/f0/T--NKU_China--songcunjiang-1366.jpg" alt="Cunjiang Song" title="Cunjiang Song" id="wows1_8" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/4/4c/T--NKU_China--zhangmengxian-1366.jpg" alt="Mengxian Zhang" title="Mengxian Zhang" id="wows1_9" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/6/68/T--NKU_China--songxinghao-1366.jpg" alt="Xinhao Song" title="Xinhao Song" id="wows1_10" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/d/dc/T--NKU_China--zhangzhaoran-4-3-1366.jpg" alt="Zhaoran Zhang" title="Zhaoran Zhang" id="wows1_11" /></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/c/ca/T--NKU_China--maxinyu-1366.jpg" alt="Ma Xinyu" title="Ma Xinyu" id="wows1_12" /></li>
 +
                        <li><a href="http://wowslider.com"><img src="https://static.igem.org/mediawiki/2016/1/10/T--NKU_China--qiaomingqiang-4-3-1366.jpg" alt="wowslider" title="Mingqiang Qiao" id="wows1_13" /></a></li>
 +
                        <li><img src="https://static.igem.org/mediawiki/2016/1/1f/T--NKU_China--shifuchen-1366.jpg" alt="Fuchen Shi" title="Fuchen Shi" id="wows1_14" /></li>
 +
                     </ul>
 
                 </div>
 
                 </div>
−
                  
+
                 <div class="ws_bullets">
−
            </div>
+
                     <div>
−
        </div>
+
                         <a href="#" title="Team"><span>1</span></a>
−
        <div id="window2" class="window">
+
                        <a href="#" title="Yuxiu Xiong"><span>2</span></a>
−
            <div class="window-placeholder"><img src=""></div>
+
                        <a href="#" title="Chen Chen"><span>3</span></a>
−
            <div class="window-content" style="background-color:blue">
+
                        <a href="#" title="Xiao Liu"><span>4</span></a>
−
                <div class="p" style="font-size:3rem">
+
                        <a href="#" title="Liangti Dai"><span>5</span></a>
−
                     Human Pratice
+
                        <a href="#" title="Zhuoer Dong"><span>6</span></a>
−
                </div>
+
                        <a href="#" title="Xianglin Zhao"><span>7</span></a>
−
               
+
                        <a href="#" title="Fankang Meng"><span>8</span></a>
−
            </div>
+
                        <a href="#" title="Cunjiang Song"><span>9</span></a>
−
        </div>
+
                        <a href="#" title="Mengxian Zhang"><span>10</span></a>
−
        <div id="window3" class="window">
+
                        <a href="#" title="Xinhao Song"><span>11</span></a>
−
            <div class="window-placeholder"><img src=""></div>
+
                        <a href="#" title="Zhaoran Zhang"><span>12</span></a>
−
            <div class="window-content" style="background-color:cyan">
+
                        <a href="#" title="Ma Xinyu"><span>13</span></a>
−
                <div class="p" style="font-size:3rem">
+
                        <a href="#" title="Mingqiang Qiao"><span>14</span></a>
−
                    Results
+
                        <a href="#" title="Fuchen Shi"><span>15</span></a>
−
                </div>
+
−
               
+
−
            </div>
+
−
        </div>
+
−
        <div id="window4" class="window">
+
−
            <div class="window-placeholder"><img src=""></div>
+
−
            <div class="window-content">
+
−
                <div id="wowslider-wrapper">
+
−
                    <div id="wowslider-container1">
+
−
                         <div class="ws_images">
+
−
                            <ul>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/d/dc/T--NKU_China--whole-group-4-3-1366.jpg" alt="Team" title="Team" id="wows1_0" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/f/fc/T--NKU_China--xiongyuxiu-4-3-1366.jpg" alt="Yuxiu Xiong" title="Yuxiu Xiong" id="wows1_1" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/1/19/T--NKU_China--chenchen-1366.jpg" alt="Chen Chen" title="Chen Chen" id="wows1_2" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/3/3a/T--NKU_China--liuxiao-4-3-1366.jpg" alt="Xiao Liu" title="Xiao Liu" id="wows1_3" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/b/be/T--NKU_China--dailiangti-1366.jpg" alt="Liangti Dai" title="Liangti Dai" id="wows1_4" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/a/a6/T--NKU_China--dongzhuoer-1366.jpg" alt="Zhuoer Dong" title="Zhuoer Dong" id="wows1_5" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/c/c6/T--NKU_China--zhaoxianglin-1366.jpg" alt="Xianglin Zhao" title="Xianglin Zhao" id="wows1_6" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/4/44/T--NKU_China--mengfankang-1366.jpg" alt="Fankang Meng" title="Fankang Meng" id="wows1_7" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/f/f0/T--NKU_China--songcunjiang-1366.jpg" alt="Cunjiang Song" title="Cunjiang Song" id="wows1_8" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/4/4c/T--NKU_China--zhangmengxian-1366.jpg" alt="Mengxian Zhang" title="Mengxian Zhang" id="wows1_9" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/6/68/T--NKU_China--songxinghao-1366.jpg" alt="Xinhao Song" title="Xinhao Song" id="wows1_10" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/d/dc/T--NKU_China--zhangzhaoran-4-3-1366.jpg" alt="Zhaoran Zhang" title="Zhaoran Zhang" id="wows1_11" /></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/c/ca/T--NKU_China--maxinyu-1366.jpg" alt="Ma Xinyu" title="Ma Xinyu" id="wows1_12" /></li>
+
−
                                <li><a href="http://wowslider.com"><img src="https://static.igem.org/mediawiki/2016/1/10/T--NKU_China--qiaomingqiang-4-3-1366.jpg" alt="wowslider" title="Mingqiang Qiao" id="wows1_13" /></a></li>
+
−
                                <li><img src="https://static.igem.org/mediawiki/2016/1/1f/T--NKU_China--shifuchen-1366.jpg" alt="Fuchen Shi" title="Fuchen Shi" id="wows1_14" /></li>
+
−
                            </ul>
+
−
                        </div>
+
−
                        <div class="ws_bullets">
+
−
                            <div>
+
−
                                <a href="#" title="Team"><span>1</span></a>
+
−
                                <a href="#" title="Yuxiu Xiong"><span>2</span></a>
+
−
                                <a href="#" title="Chen Chen"><span>3</span></a>
+
−
                                <a href="#" title="Xiao Liu"><span>4</span></a>
+
−
                                <a href="#" title="Liangti Dai"><span>5</span></a>
+
−
                                <a href="#" title="Zhuoer Dong"><span>6</span></a>
+
−
                                <a href="#" title="Xianglin Zhao"><span>7</span></a>
+
−
                                <a href="#" title="Fankang Meng"><span>8</span></a>
+
−
                                <a href="#" title="Cunjiang Song"><span>9</span></a>
+
−
                                <a href="#" title="Mengxian Zhang"><span>10</span></a>
+
−
                                <a href="#" title="Xinhao Song"><span>11</span></a>
+
−
                                <a href="#" title="Zhaoran Zhang"><span>12</span></a>
+
−
                                <a href="#" title="Ma Xinyu"><span>13</span></a>
+
−
                                <a href="#" title="Mingqiang Qiao"><span>14</span></a>
+
−
                                <a href="#" title="Fuchen Shi"><span>15</span></a>
+
−
                            </div>
+
−
                        </div>
+
−
                        <div class="ws_shadow"></div>
+
 
                     </div>
 
                     </div>
−
                    <script type="text/javascript" src="https://2016.igem.org/Template:NKU_China/js/wowslider?action=raw&ctype=text/javascript"></script>
 
−
                    <script type="text/javascript" src="https://2016.igem.org/Template:NKU_China/js/script/Home-team?action=raw&ctype=text/javascript"></script>
 
 
                 </div>
 
                 </div>
 +
                <div class="ws_shadow"></div>
 
             </div>
 
             </div>
 +
            <script type="text/javascript" src="https://2016.igem.org/Template:NKU_China/js/wowslider?action=raw&ctype=text/javascript"></script>
 +
            <script type="text/javascript" src="https://2016.igem.org/Template:NKU_China/js/script/Home-team?action=raw&ctype=text/javascript"></script>
 
         </div>
 
         </div>
 
     </main>
 
     </main>

Revision as of 08:36, 28 August 2016

  • Team
  • Yuxiu Xiong
  • Chen Chen
  • Xiao Liu
  • Liangti Dai
  • Zhuoer Dong
  • Xianglin Zhao
  • Fankang Meng
  • Cunjiang Song
  • Mengxian Zhang
  • Xinhao Song
  • Zhaoran Zhang
  • Ma Xinyu
  • wowslider
  • Fuchen Shi
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15