Difference between revisions of "Team:NJU-China/Team"

Line 2: Line 2:
 
<html lang="en">
 
<html lang="en">
 
<head>
 
<head>
 +
 
<meta charset="UTF-8">
 
<meta charset="UTF-8">
 
<title>TEAM</title>
 
<title>TEAM</title>
Line 10: Line 11:
 
<script type="text/javascript" src="https://2017.igem.org/Team:NJU-China/Javascript:jquery-scripts?action=raw&ctype=text/javascript"></script>
 
<script type="text/javascript" src="https://2017.igem.org/Team:NJU-China/Javascript:jquery-scripts?action=raw&ctype=text/javascript"></script>
 
<script type="text/javascript" src="https://2017.igem.org/Team:NJU-China/Javascript:jquery-jumpto?action=raw&ctype=text/javascript"></script>
 
<script type="text/javascript" src="https://2017.igem.org/Team:NJU-China/Javascript:jquery-jumpto?action=raw&ctype=text/javascript"></script>
 +
<link rel="stylesheet" type="text/css" href="https://2017.igem.org/Team:NJU-China/CSS:loaderskit?action=raw&ctype=text/css">
  
 
<style>
 
<style>
 +
.loader {
 +
                position: fixed;
 +
                left: 0px;
 +
                top: 0px;
 +
                width: 100%;
 +
                height: 100%;
 +
                z-index: 9999;
 +
                background: url('https://static.igem.org/mediawiki/2017/b/bd/NJU_China_iGEM_2017_loading.gif') 50% 50% no-repeat rgb(249, 249, 249);
 +
            }
 
#sideMenu,
 
#sideMenu,
 
#top_title{
 
#top_title{
Line 102: Line 113:
 
     transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1);
 
     transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1);
 
}
 
}
−
.teamtop
+
.card {
−
{
+
            width: 350px;
−
    display: table;
+
            height: 484px;
−
    width: 100%;
+
          }
−
    height: 475px;
+
          .front, .other-front {
−
    background-image: url("https://static.igem.org/mediawiki/2017/e/e3/NJU_China_iGEM_2017_teamtop.jpg");
+
            background-image: url(img/team/纸牌.png);
−
    background-attachment: fixed;
+
            background-size: 350px 484px;
−
 
+
            padding: 200px;
−
}
+
          }
 +
          .back, .other-back {
 +
            background-color: #3B3C3C;
 +
            width: 350px;
 +
            height: 484px;
 +
            color: #fff;
 +
          }
 
</style>
 
</style>
 
</head>
 
</head>
Line 183: Line 200:
 
                     <a href="#Background" data-number="1">
 
                     <a href="#Background" data-number="1">
 
                         <span class="cd-dot"></span>
 
                         <span class="cd-dot"></span>
−
                         <span class="cd-label">Background</span>
+
                         <span class="cd-label">PI</span>
 
                     </a>
 
                     </a>
 
                 </li>
 
                 </li>
Line 189: Line 206:
 
                     <a href="#Design" data-number="2">
 
                     <a href="#Design" data-number="2">
 
                         <span class="cd-dot"></span>
 
                         <span class="cd-dot"></span>
−
                         <span class="cd-label">Design</span>
+
                         <span class="cd-label">Instructors</span>
 
                     </a>
 
                     </a>
 
                 </li>
 
                 </li>
Line 195: Line 212:
 
                     <a href="#Reference" data-number="3">
 
                     <a href="#Reference" data-number="3">
 
                         <span class="cd-dot"></span>
 
                         <span class="cd-dot"></span>
−
                         <span class="cd-label">Reference</span>
+
                         <span class="cd-label">Advisors</span>
 
                     </a>
 
                     </a>
 
                 </li>
 
                 </li>
 +
                <li>
 +
                    <a href="#Reference" data-number="3">
 +
                        <span class="cd-dot"></span>
 +
                        <span class="cd-label">Team Members</span>
 +
                    </a>
 +
                </li>               
 
             </ul>
 
             </ul>
 
         </nav>         
 
         </nav>         
 
         <!-- Page Content -->
 
         <!-- Page Content -->
−
       
+
     
 
<div id="page-content-wrapper">
 
<div id="page-content-wrapper">
 
           <button type="button" class="hamburger is-closed animated fadeInLeft" data-toggle="offcanvas">
 
           <button type="button" class="hamburger is-closed animated fadeInLeft" data-toggle="offcanvas">
Line 208: Line 231:
 
             <span class="hamb-bottom"></span>
 
             <span class="hamb-bottom"></span>
 
           </button>
 
           </button>
−
         <div class="teamtop">
+
         <div class="projecttop">
 
              
 
              
 
         </div>
 
         </div>
Line 217: Line 240:
 
             <h2>PI</h2>
 
             <h2>PI</h2>
 
             <div class="container">
 
             <div class="container">
−
                 <div class="row">
+
                 <div class="row" style="text-align: center;">
 +
                    <div class="col-md-6" >
 +
                        <img src="img/相框.png" alt="" style="height: 510px;width: 520px;">
 +
                        <br />
 +
                    </div>
 +
                    <div class="col-md-6">
 +
                        <img src="img/相框.png" alt="" style="height: 510px;width: 520px;">
 +
 
 +
                    </div>
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
Line 223: Line 254:
 
             <div class="container">
 
             <div class="container">
 
                 <div class="row">
 
                 <div class="row">
 +
                <div class="col-md-4">
 +
                    <div id="card" class="card">
 +
                        <div class="front" style="padding: 50px;">
 +
                            Front
 +
                        </div>
 +
                        <div class="back" >
 +
                            Hi iGEMers! I’m Yijun From Nanjing University, a senior student majoring in Life Sciences. So glad to join our NJU-China family and the past few months we spent together were really memorable and meaningful to me. In our team, I contributed mostly to some experiments and human practice. And I’m also one of the presenters to illustrate our project at the Giant Jamboree in iGEM2017. iGEM really provided me with a good opportunity to communicate and share ideas with outstanding peers without border. And now I’m prepared for the jamboree fun !
 +
                        </div>                   
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-4">
 +
                    <div id="card" class="card">
 +
                        <div class="front">
 +
                            Front
 +
                        </div>
 +
                        <div class="back">
 +
                            Back
 +
                        </div>                   
 +
                    </div>
 +
                </div>               
 +
                <div class="col-md-4">
 +
                    <div id="card" class="card">
 +
                        <div class="front">
 +
                            Front
 +
                        </div>
 +
                        <div class="back">
 +
                            Back
 +
                        </div>                   
 +
                    </div>
 +
                </div>                               
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
Line 239: Line 300:
 
   <div id="NJU-CHINA" class="foot" style="padding: 10px 0;background-color: black;color: white;">   
 
   <div id="NJU-CHINA" class="foot" style="padding: 10px 0;background-color: black;color: white;">   
 
             <div class="container">
 
             <div class="container">
 +
                <section>
 +
            </section>
 
                 <div class="row">
 
                 <div class="row">
 
                     <div class="col-sm-6 col-md-6">
 
                     <div class="col-sm-6 col-md-6">
Line 290: Line 353:
 
           });   
 
           });   
 
         });
 
         });
 +
    </script>
 +
    <div class="loader"></div>
 +
        <script type="text/javascript">
 +
            $(window).load(function() {
 +
                $(".loader").fadeOut("slow");
 +
            })
 +
        </script>
 +
            <script src="js/jquery.flip.min.js"></script>
 +
    <script type="text/javascript">
 +
        $(function(){
 +
              $(".card").flip({
 +
                trigger: "hover"
 +
              });
 +
            });
 
     </script>
 
     </script>
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 18:25, 31 October 2017

<!DOCTYPE html> TEAM

PI


Instructors

Front
Hi iGEMers! I’m Yijun From Nanjing University, a senior student majoring in Life Sciences. So glad to join our NJU-China family and the past few months we spent together were really memorable and meaningful to me. In our team, I contributed mostly to some experiments and human practice. And I’m also one of the presenters to illustrate our project at the Giant Jamboree in iGEM2017. iGEM really provided me with a good opportunity to communicate and share ideas with outstanding peers without border. And now I’m prepared for the jamboree fun !
Front
Back
Front
Back

Advisors

Team Members