Difference between revisions of "Team:DLUT China B"

(修改顶部轮播图,修正对话气泡语法。)
(增加六个圈。)
Line 4: Line 4:
 
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
     <title>2018 iGEM_DLUT_B</title>
 
     <title>2018 iGEM_DLUT_B</title>
     <link rel="stylesheet" href="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/css/style.css&action=raw&ctype=text/css">
+
     <link rel="stylesheet"
     <link rel="stylesheet" href="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/css/nav.css&action=raw&ctype=text/css">
+
          href="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/css/style.css&action=raw&ctype=text/css">
     <link rel="stylesheet" href="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/css/bubbles.css&action=raw&ctype=text/css">
+
     <link rel="stylesheet"
     <link rel="stylesheet" href="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/css/slideshow.css&action=raw&ctype=text/css">
+
          href="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/css/nav.css&action=raw&ctype=text/css">
    <link rel="stylesheet" href="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/css/fontawesome.css&action=raw&ctype=text/css">
+
     <link rel="stylesheet"
 +
          href="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/css/bubbles.css&action=raw&ctype=text/css">
 +
     <link rel="stylesheet"
 +
          href="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/css/fontawesome.css&action=raw&ctype=text/css">
  
    <script src="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/js/slideshow.js&action=raw&ctype=text/javascript"></script>
 
 
     <script src="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/js/bubbles.js&action=raw&ctype=text/javascript"></script>
 
     <script src="https://2018.igem.org/wiki/index.php?title=Template:DLUT_China_B/js/bubbles.js&action=raw&ctype=text/javascript"></script>
  
Line 30: Line 32:
 
<div id="dlutb">
 
<div id="dlutb">
 
     <div id="header">
 
     <div id="header">
 +
        <div id="nav"></div>
 
         <div id="box">
 
         <div id="box">
             <div id="box_img">
+
             <img src="img/Top1.png">
                <ul></ul>
+
            </div>
+
 
             <div id="word">
 
             <div id="word">
                 <ul></ul>
+
                 <h2>DLUT China B</h2>
 +
                <p>DLUT China B</p>
 
             </div>
 
             </div>
            <div id="controller">
 
                <div id="backward"><i class="fas fa-angle-left"></i></div>
 
                <div id="forward"><i class="fas fa-angle-right"></i></div>
 
            </div>
 
            <script>
 
                let data = [
 
                    {
 
                        "src": "https://static.igem.org/mediawiki/2018/1/1a/T--DLUT_China_B--Top1.jpg",
 
                        "title": "DLUT China B",
 
                        "description": "DLUT China B",
 
                    },
 
                    {
 
                        "src": "https://static.igem.org/mediawiki/2018/0/04/T--DLUT_China_B--Top2.jpg",
 
                        "title": "Principle",
 
                        "description": "Principle.",
 
                    }
 
                ];
 
                $(document).ready(slideshow(data));
 
            </script>
 
 
         </div>
 
         </div>
 
        <div id="nav"></div>
 
 
         <br>
 
         <br>
 
     </div>
 
     </div>
  
    <h2 class="title">Circles</h2>
 
 
     <div id="circle">
 
     <div id="circle">
 
         <div class="tr">
 
         <div class="tr">
             <div class="td">a</div>
+
             <div class="td">
             <div class="td">b</div>
+
                <a href="https://2018.igem.org/Team:DLUT_China_B/Description">
             <div class="td">c</div>
+
                    <img src="https://static.igem.org/mediawiki/2018/b/b8/T--DLUT_China_B--Circle1.png" width="250">
 +
                    <div>Project</div>
 +
                </a>
 +
            </div>
 +
             <div class="td">
 +
                <a href="https://2018.igem.org/Team:DLUT_China_B/PartsOverview">
 +
                    <img src="https://static.igem.org/mediawiki/2018/f/f0/T--DLUT_China_B--Circle2.png" width="250">
 +
                    <div>Parts</div>
 +
                </a>
 +
            </div>
 +
             <div class="td">
 +
                <a href="https://2018.igem.org/Team:DLUT_China_B/ConditionOptimization">
 +
                    <img src="https://static.igem.org/mediawiki/2018/c/c6/T--DLUT_China_B--Circle3.png" width="250">
 +
                    <div>Model</div>
 +
                </a>
 +
            </div>
 
         </div>
 
         </div>
 
         <div class="tr">
 
         <div class="tr">
             <div class="td">d</div>
+
             <div class="td">
             <div class="td">e</div>
+
                <a href="https://2018.igem.org/Team:DLUT_China_B/AppliedDesign">
             <div class="td">f</div>
+
                    <img src="https://static.igem.org/mediawiki/2018/7/71/T--DLUT_China_B--Circle4.png" width="250">
 +
                    <div>Awards</div>
 +
                </a>
 +
            </div>
 +
             <div class="td">
 +
                <a href="https://2018.igem.org/Team:DLUT_China_B/HumanPractice">
 +
                    <img src="https://static.igem.org/mediawiki/2018/6/63/T--DLUT_China_B--Circle5.png" width="250">
 +
                    <div>Human Practice</div>
 +
                </a>
 +
            </div>
 +
             <div class="td">
 +
                <a href="https://2018.igem.org/Team:DLUT_China_B/TeamMembers">
 +
                    <img src="https://static.igem.org/mediawiki/2018/0/06/T--DLUT_China_B--Circle6.png" width="250">
 +
                    <div>Team</div>
 +
                </a>
 +
            </div>
 
         </div>
 
         </div>
 
     </div>
 
     </div>
  
 
     <div>
 
     <div>
         <h2 class="title">Chat Bubbles</h2>
+
         <h2 class="title">Click bubbles to chat with me</h2>
 
         <div id="chatBubbles"></div>
 
         <div id="chatBubbles"></div>
 
     </div>
 
     </div>
Line 426: Line 436:
 
             let winH = $(window).height(), /*获取窗口高度*/
 
             let winH = $(window).height(), /*获取窗口高度*/
 
                 scrollH = $(window).scrollTop(), /*获取窗口滚动高度*/
 
                 scrollH = $(window).scrollTop(), /*获取窗口滚动高度*/
                 top = $el.offsetTop; /*获取元素距离窗口顶部偏移高度*/
+
                 top = $el.offsetTop;
 +
            /*获取元素距离窗口顶部偏移高度*/
 
             return top < scrollH + winH;
 
             return top < scrollH + winH;
 
         }
 
         }

Revision as of 11:46, 10 October 2018

2018 iGEM_DLUT_B

Click bubbles to chat with me