Difference between revisions of "Template:FAFU CHINA/try"

Line 1: Line 1:
<html>
+
<html lang="zh">
 
<head>
 
<head>
<meta charset="utf-8">
+
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, maximum-scale=1">
+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">  
<title>Homepage</title>
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="https://static.igem.org/mediawiki/2015/1/19/Fafu_favicon.png" type="image/png">
+
<title>侧边栏</title>
<link rel="shortcut icon" href="favicon.ico" type="img/x-icon">
+
<link rel="stylesheet" href="https://2015.igem.org/Template:Amoy/css/HomeCss?action=raw&amp;ctype=text/css" type="text/css" />
 
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/guge/css/normalize?action=raw&amp;ctype=text/css" />
 +
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/guge/css/default?action=raw&amp;ctype=text/css" />
 +
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/guge/css/styles?action=raw&amp;ctype=text/css" />
 +
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/bootstrap?action=raw&amp;ctype=text/css" />
 +
<script type='text/javascript'        src ='/common/tablesorter/jquery.tablesorter.min.js'></script>
 +
<link rel='stylesheet' type='text/css' href='/common/tablesorter/themes/groupparts/style.css' />
 +
<link rel='stylesheet' type='text/css' href='/common/table_styles.css' />
 
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/wailian/css/Montserrat?action=raw&amp;ctype=text/css" />
 
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/wailian/css/Montserrat?action=raw&amp;ctype=text/css" />
 
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/wailian/css/Open-Sans?action=raw&amp;ctype=text/css" />
 
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/wailian/css/Open-Sans?action=raw&amp;ctype=text/css" />
 
 
<link rel="stylesheet" href="https://2015.igem.org/Template:Amoy/css/HomeCss?action=raw&amp;ctype=text/css" type="text/css" />
 
<link rel="stylesheet" href="https://2015.igem.org/Template:Amoy/css/HomeCss?action=raw&amp;ctype=text/css" type="text/css" />
 
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/bootstrap?action=raw&amp;ctype=text/css" />
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/bootstrap?
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/style?action=raw&amp;ctype=text/css" />
 
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/stylesheet?action=raw&amp;ctype=text/css" />
action=raw&amp;ctype=text/css" />
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/font-awesome?action=raw&amp;ctype=text/css" />
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/style?
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/responsive?action=raw&amp;ctype=text/css" />
 
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/animate?action=raw&amp;ctype=text/css" />
action=raw&amp;ctype=text/css" />
+
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/stylesheet?
+
<script src="http://libs.useso.com/js/html5shiv/3.7/html5shiv.min.js"></script>
 
+
action=raw&amp;ctype=text/css" />
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/font-awesome?
+
 
+
action=raw&amp;ctype=text/css" />
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/responsive?
+
 
+
action=raw&amp;ctype=text/css" />
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:FAFU_CHINA/index2/css/animate?
+
 
+
action=raw&amp;ctype=text/css" />
+
 
+
<!--[if IE]><style type="text/css">.pie {behavior:url(PIE.htc);}</style><![endif]-->
+
 
+
<script type="text/javascript"
+
 
+
src="http://https://2015.igem.org/Template:FAFU_CHINA/index2/js/jquery-1-8-3-min?action=raw&amp;ctype=text/javascript"></script>
+
<script type="text/javascript" src="https://2015.igem.org/Template:FAFU_CHINA/index2/js/bootstrap?action=raw&amp;ctype=text/javascript"></script>
+
<script type="text/javascript" src="https://2015.igem.org/Template:FAFU_CHINA/index2/js/jquery-scrolltofixed?action=raw&amp;ctype=text/javascript"></script>
+
<script type="text/javascript"
+
 
+
src="https://2015.igem.org/Template:FAFU_CHINA/index2/js/jquery-easing-1-3?action=raw&amp;ctype=text/javascript"></script>
+
<script type="text/javascript"
+
 
+
src="http://https://2015.igem.org/Template:FAFU_CHINA/index2/js/jquery-isotope?action=raw&amp;ctype=text/javascript"></script>
+
<script type="text/javascript" src="https://2015.igem.org/Template:FAFU_CHINA/index2/js/wow?action=raw&amp;ctype=text/javascript"></script>
+
<script type="text/javascript" src="https://2015.igem.org/Template:FAFU_CHINA/index2/js/classie?action=raw&amp;ctype=text/javascript"></script>
+
 
+
 
+
<!--[if lt IE 9]>
+
    <script src="https://2015.igem.org/Template:FAFU_CHINA/index2/js/respond-1-1-0-min?action=raw&amp;ctype=text/javascript"></script>
+
    <script src="https://2015.igem.org/Template:FAFU_CHINA/index2/js/html5shiv?action=raw&amp;ctype=text/javascript"></script>
+
    <script src="https://2015.igem.org/Template:FAFU_CHINA/index2/js/html5element?action=raw&amp;ctype=text/javascript"></script>
+
 
<![endif]-->
 
<![endif]-->
 
 
 
</head>
 
</head>
 
<body>
 
<body>
<div style="overflow:hidden;">
+
<div class="com">
 
+
<div class="com__content">
 
+
<section class="com__section com__section--text">
 
+
 
+
<header class="header" id="header"><!--header-start-->
+
<div class="container">
+
    <figure class="logo animated fadeInDown delay-07s">
+
        <a href="#"><img src="https://static.igem.org/mediawiki/2015/7/76/Fafu_head_logo2.png" alt=""></a>
+
        </figure>
+
        <h1 class="animated fadeInDown delay-07s">Welcome To FAFU-CHINA IGEM</h1>
+
        <ul class="we-create animated fadeInUp delay-1s">
+
        <li>------CSBV.Silencer------</li>
+
        </ul>
+
            <a class="link animated fadeInUp delay-1s" href="#">Get Started</a>
+
    </div>
+
</div>
+
</header><!--header-end-->
+
 
+
 
+
<nav class="main-nav-outer" id="test"><!--main-nav-start-->
+
<div class="container">
+
        <ul class="main-nav">
+
        <li><a href="#header">Home</a></li>
+
            <li><a href="#service">Services</a></li>
+
            <li><a href="#Portfolio">Portfolio</a></li>
+
            <li class="small-logo"><a href="#header"><img
+
 
+
src="https://static.igem.org/mediawiki/2015/4/43/Fafu_small-logo.png" alt=""></a></li>
+
            <li><a href="#client">Clients</a></li>
+
            <li><a href="#team">Team</a></li>
+
            <li><a href="#contact">Contact</a></li>
+
        </ul>
+
        <a class="res-nav_click" href="#"><i class="fa-bars"></i></a>
+
    </div>
+
</nav><!--main-nav-end-->
+
 
+
 
+
<section class="main-section paddind" id="Portfolio"><!--main-section-start-->
+
<div class="container">
+
    <h2>Portfolio</h2>
+
    <h6>Fresh portfolio of designs that will keep you wanting more.</h6>
+
      <div class="portfolioFilter"> 
+
        <ul class="Portfolio-nav wow fadeIn delay-02s">
+
        <li><a href="#" data-filter="*" class="current" >All</a></li>
+
        </ul>
+
      </div>
+
       
+
</div>
+
    <div class="portfolioContainer wow fadeInUp delay-04s">
+
            <div class=" Portfolio-box printdesign">
+
                <a href="#"><img src="https://static.igem.org/mediawiki/2015/e/e6/Fafu_Portfolio-pic1.jpg"
+
 
+
alt=""></a>
+
                <h3>Foto Album</h3>
+
                    <p>Print Design</p>
+
                </div>
+
                <div class="Portfolio-box webdesign">
+
                <a href="#"><img src="https://static.igem.org/mediawiki/2015/3/31/Fafu_Portfolio-pic2.jpg"
+
 
+
alt=""></a>
+
                <h3>Luca Theme</h3>
+
                    <p>Web Design</p>
+
                </div>
+
                <div class=" Portfolio-box branding">
+
                <a href="#"><img src="https://static.igem.org/mediawiki/2015/d/d6/Fafu_Portfolio-pic3.jpg"
+
 
+
alt=""></a>
+
                <h3>Uni Sans</h3>
+
                    <p>Branding</p>
+
                </div>
+
                <div class=" Portfolio-box photography" >
+
                <a href="#"><img src="https://static.igem.org/mediawiki/2015/8/85/Fafu_Portfolio-pic4.jpg"
+
 
+
alt=""></a>
+
                <h3>Vinyl Record</h3>
+
                    <p>Photography</p>
+
                </div>
+
                <div class=" Portfolio-box branding">
+
                <a href="#"><img src="https://static.igem.org/mediawiki/2015/a/a1/Fafu_Portfolio-pic5.jpg"
+
 
+
alt=""></a>
+
                <h3>Hipster</h3>
+
                    <p>Branding</p>
+
                </div>
+
                <div class=" Portfolio-box photography">
+
                <a href="#"><img src="https://static.igem.org/mediawiki/2015/8/86/Fafu_Portfolio-pic6.jpg"
+
 
+
alt=""></a>
+
                <h3>Windmills</h3>
+
                    <p>Photography</p>
+
                </div>
+
    </div>
+
</section><!--main-section-end-->
+
 
+
<section class="main-section" id="service"><!--main-section-start-->
+
<div class="container">
+
            <div class="row">
+
              <div class="col-lg-12 col-sm-12 wow fadeInLeft delay-05s">
+
                          <h2>Safety & Part</h2>
+
    <h6>We offer exceptional service with complimentary hugs.</h6>
+
                </div>
+
              </div>
+
        <div class="col-lg-4 col-sm-6 wow fadeInLeft delay-05s">
+
            <div class="service-list">
+
                <div class="service-list-col1">
+
                    <i class="fa-paw"></i>
+
                    </div>
+
                <div class="service-list-col2">
+
                        <h3>branding &amp; identity</h3>
+
                        <p>Proin iaculis purus digni consequat sem digni ssim. Donec entum digni ssim.</p>
+
                    </div>
+
                </div>
+
                <div class="service-list">
+
                <div class="service-list-col1">
+
                    <i class="fa-gear"></i>
+
                    </div>
+
                <div class="service-list-col2">
+
                        <h3>web development</h3>
+
                        <p>Proin iaculis purus consequat sem digni ssim. Digni ssim porttitora .</p>
+
                    </div>
+
                </div>
+
                <div class="service-list">
+
                <div class="service-list-col1">
+
                    <i class="fa-apple"></i>
+
                    </div>
+
                <div class="service-list-col2">
+
                        <h3>mobile design</h3>
+
                        <p>Proin iaculis purus consequat digni sem digni ssim. Purus donec porttitora
+
 
+
entum.</p>
+
                    </div>
+
                </div>
+
                <div class="service-list">
+
                <div class="service-list-col1">
+
                    <i class="fa-medkit"></i>
+
                    </div>
+
                <div class="service-list-col2">
+
                        <h3>24/7 Support</h3>
+
                        <p>Proin iaculis purus consequat sem digni ssim. Sem porttitora entum.</p>
+
                    </div>
+
                </div>
+
            </div>
+
            <figure class="col-lg-8 col-sm-6  text-right wow fadeInUp delay-02s">
+
            <img src="https://static.igem.org/mediawiki/2015/e/e5/Fafu_macbook-pro.png" alt="">
+
            </figure>
+
       
+
        </div>
+
</div>
+
</section><!--main-section-end-->
+
 
+
 
+
 
+
<section class="main-section alabaster"><!--main-section alabaster-start-->
+
<div class="container">
+
    <div class="row">
+
<figure class="col-lg-5 col-sm-4 wow fadeInLeft">
+
            <img  src="https://static.igem.org/mediawiki/2015/b/b8/FAFU-CHINA_improvement_part.png"
+
 
+
alt="">
+
            </figure>
+
<figure class="col-lg-5 col-sm-4 wow fadeInLeft">
+
            <img  src="https://static.igem.org/mediawiki/2015/3/34/FAFU-CHINA_NEW_PART.png" alt="">
+
            </figure>
+
        </div>
+
</div>
+
</section><!--main-section alabaster-end-->
+
 
+
 
+
 
+
 
+
<!------------------此处移除1-------------->
+
 
+
<div class="copyrights">Collect from <a href="http://www.cssmoban.com/" >手机网站模板</a></div>
+
<section class="main-section client-part" id="client"><!--main-section client-part-start-->
+
<div class="container">
+
<b class="quote-right wow fadeInDown delay-03"><i class="fa-quote-right"></i></b>
+
    <div class="row">
+
        <div class="col-lg-12">
+
            <p class="client-part-haead wow fadeInDown delay-05">It was a pleasure to work with the guys at
+
 
+
Knight Studio. They made sure
+
we were well fed and drunk all the time!</p>
+
            </div>
+
        </div>
+
    <ul class="client wow fadeIn delay-05s">
+
        <li><a href="#">
+
            <img src="https://static.igem.org/mediawiki/2015/1/1e/Fafu_client-pic1.jpg" alt="">
+
                <h3>James Bond</h3>
+
                <span>License To Drink Inc.</span>
+
            </a></li>
+
        </ul>
+
    </div>
+
</section><!--main-section client-part-end-->
+
<div class="c-logo-part"><!--c-logo-part-start-->
+
<div class="container">
+
    <ul>
+
        <li><a href="#"><img src="https://static.igem.org/mediawiki/2015/6/6f/Fafu_c-liogo1.png"
+
  
alt=""></a></li>
 
            <li><a href="#"><img src="https://static.igem.org/mediawiki/2015/4/4e/Fafu_c-liogo2.png" alt=""></a></li>
 
            <li><a href="#"><img src="https://static.igem.org/mediawiki/2015/b/b4/Fafu_c-liogo3.png" alt=""></a></li>
 
            <li><a href="#"><img src="https://static.igem.org/mediawiki/2015/c/c0/Fafu_c-liogo4.png" alt=""></a></li>
 
            <li><a href="#"><img src="https://static.igem.org/mediawiki/2015/7/7e/Fafu_c-liogo5.png" alt=""></a></li>
 
    </ul>
 
</div>
 
</div><!--c-logo-part-end-->
 
<section class="main-section team" id="team"><!--main-section team-start-->
 
 
<div class="container">
 
<div class="container">
 
         <h2>team</h2>
 
         <h2>team</h2>
        <h6>Take a closer look into our amazing team. We won’t bite.</h6>
 
 
         <div class="team-leader-block clearfix">
 
         <div class="team-leader-block clearfix">
 
             <div class="team-leader-box">
 
             <div class="team-leader-box">
Line 481: Line 246:
 
         </div>
 
         </div>
 
     </div>
 
     </div>
</section><!--main-section team-end-->
 
  
  
  
<section class="business-talking"><!--business-talking-start-->
+
        </section>
<div class="container">
+
</div>
        <h2>Let’s Talk Business.</h2>
+
<nav class="com__nav">
    </div>
+
<ul class="com__nav-list">
</section><!--business-talking-end-->
+
<li class="com__nav-item">
<div class="container">
+
<h1>外内容1</h1>
<section class="main-section contact" id="contact">
+
<a href="" class="com__nav-link">
+
<h1>里内容1</h1>
        <div class="row">
+
<span class="blue-line animate scaleInLeft delay-2"></span>
        <div class="col-lg-6 col-sm-7 wow fadeInLeft">
+
<span class="white-line animate scaleInLeft delay-4"></span>
            <div class="contact-info-box address clearfix">
+
<span class="white-line animate scaleInLeft delay-5"></span>
                <h3><i class=" icon-map-marker"></i>Address:</h3>
+
</a>
                <span>308 Negra Arroyo Lane<br>Albuquerque, New Mexico, 87111.</span>
+
</li>
                </div>
+
<li class="com__nav-item">
                <div class="contact-info-box phone clearfix">
+
<h1>外内容2</h1>
                <h3><i class="fa-phone"></i>Phone:</h3>
+
<a href="" class="com__nav-link flex-row">
                <span>1-800-BOO-YAHH</span>
+
<h1>里内容2</h1>
                </div>
+
<div class="com__section-half">
                <div class="contact-info-box email clearfix">
+
<span class="blue-line animate scaleInLeft delay-3"></span>
                <h3><i class="fa-pencil"></i>email:</h3>
+
<span class="white-line animate scaleInLeft delay-4"></span>
                <span>hello@knightstudios.com</span>
+
</div>
                </div>
+
<div class="com__section-half">
            <div class="contact-info-box hours clearfix">
+
<span class="white-circle animate slideInRight delay-5"></span>
                <h3><i class="fa-clock-o"></i>Hours:</h3>
+
</div>
                <span><strong>Monday - Thursday:</strong> 10am - 6pm<br><strong>Friday:</strong> People
+
</a>
 
+
</li>
work on Fridays now?<br><strong>Saturday - Sunday:</strong> Best not to ask.</span>
+
<li class="com__nav-item">
                </div>
+
<h1>外内容3</h1>
                <ul class="social-link">
+
<a href="" class="com__nav-link centered">
                <li class="twitter"><a href="#"><i class="fa-twitter"></i></a></li>
+
<h1>里内容3</h1>
                    <li class="facebook"><a href="#"><i class="fa-facebook"></i></a></li>
+
<span class="blue-line animate scaleIn delay-3"></span>
                    <li class="pinterest"><a href="#"><i class="fa-pinterest"></i></a></li>
+
<span class="white-circle animate scaleIn delay-5"></span>
                    <li class="gplus"><a href="#"><i class="fa-google-plus"></i></a></li>
+
</a>
                    <li class="dribbble"><a href="#"><i class="fa-dribbble"></i></a></li>
+
</li>
                </ul>
+
<li class="com__nav-item">
            </div>
+
<h1>外内容4</h1>
        <div class="col-lg-6 col-sm-5 wow fadeInUp delay-05s">
+
<a href="" class="com__nav-link">
            <div class="form">
+
<h1>里内容4</h1>
                <input class="input-text" type="text" name="" value="Your Name *" onFocus="if
+
<span class="blue-line animate scaleInLeft delay-2"></span>
 
+
<span class="white-line animate scaleInLeft delay-4"></span>
(this.value==this.defaultValue)this.value='';" onBlur="if(this.value=='')this.value=this.defaultValue;">
+
<span class="white-line animate scaleInLeft delay-5"></span>
                    <input class="input-text" type="text" name="" value="Your E-mail *" onFocus="if
+
</a>
 
+
</li>
(this.value==this.defaultValue)this.value='';" onBlur="if(this.value=='')this.value=this.defaultValue;">
+
<li class="com__nav-item">
                <textarea class="input-text text-area" cols="0" rows="0" onFocus="if
+
<h1>外内容5</h1>
 
+
<a href="" class="com__nav-link flex-row">
(this.value==this.defaultValue)this.value='';" onBlur="if(this.value=='')this.value=this.defaultValue;">Your
+
<h1>里内容5</h1>
 
+
<div class="com__section-half">
Message *</textarea>
+
<span class="blue-line animate scaleInLeft delay-3"></span>
                    <input class="input-btn" type="submit" value="send message">
+
<span class="white-line animate scaleInLeft delay-4"></span>
                </div>
+
</div>
            </div>
+
<div class="com__section-half">
        </div>
+
<span class="white-circle animate slideInRight delay-5"></span>
</section>
+
</div>
 +
</a>
 +
</li>
 +
<li class="com__nav-item">
 +
<h1>外内容6</h1>
 +
<a href="" class="com__nav-link centered">
 +
<h1>里内容6</h1>
 +
<span class="blue-line animate scaleIn delay-3"></span>
 +
<span class="white-circle animate scaleIn delay-5"></span>
 +
</a>
 +
</li>
 +
<li class="com__nav-item">
 +
<h1>外内容7</h1>
 +
<a href="" class="com__nav-link">
 +
<h1>里内容7</h1>
 +
<span class="blue-line animate scaleInLeft delay-2"></span>
 +
<span class="white-line animate scaleInLeft delay-4"></span>
 +
<span class="white-line animate scaleInLeft delay-5"></span>
 +
</a>
 +
</li>
 +
<li class="com__nav-item">
 +
<h1>外内容8</h1>
 +
<a href="" class="com__nav-link">
 +
<h1>里内容8</h1>
 +
<span class="blue-line animate scaleInLeft delay-2"></span>
 +
<span class="white-line animate scaleInLeft delay-4"></span>
 +
<span class="white-line animate scaleInLeft delay-5"></span>
 +
</a>
 +
</li>
 +
<li class="com__nav-item">
 +
<h1>外内容9</h1>
 +
<a href="" class="com__nav-link">
 +
<h1>里内容9</h1>
 +
<span class="blue-line animate scaleInLeft delay-2"></span>
 +
<span class="white-line animate scaleInLeft delay-4"></span>
 +
<span class="white-line animate scaleInLeft delay-5"></span>
 +
</a>
 +
</li>
 +
</ul>
 +
</nav>
 
</div>
 
</div>
<footer class="footer">
 
    <div class="container">
 
        <div class="footer-logo"><a href="#"><img src="https://static.igem.org/mediawiki/2015/0/05/Fafu_footer-
 
 
logo.png" alt=""></a></div>
 
        <span class="copyright">Copyright ? 2014 Knight. More Templates <a href="http://www.cssmoban.com/"
 
 
target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板
 
 
" target="_blank">网页模板</a>.</span>
 
    </div>
 
</footer>
 
 
 
<script type="text/javascript">
 
    $(document).ready(function(e) {
 
        $('#test').scrollToFixed();
 
        $('.res-nav_click').click(function(){
 
            $('.main-nav').slideToggle();
 
            return false   
 
           
 
        });
 
       
 
    });
 
</script>
 
 
  <script>
 
    wow = new WOW(
 
      {
 
        animateClass: 'animated',
 
        offset:      100
 
      }
 
    );
 
    wow.init();
 
    document.getElementById('').onclick = function() {
 
      var section = document.createElement('section');
 
      section.className = 'wow fadeInDown';
 
      this.parentNode.insertBefore(section, this);
 
    };
 
  </script>
 
 
 
<script type="text/javascript">
 
$(window).load(function(){
 
 
$('.main-nav li a').bind('click',function(event){
 
var $anchor = $(this);
 
 
$('html, body').stop().animate({
 
scrollTop: $($anchor.attr('href')).offset().top - 102
 
}, 1500,'easeInOutExpo');
 
/*
 
if you don't want to use the easing effects:
 
$('html, body').stop().animate({
 
scrollTop: $($anchor.attr('href')).offset().top
 
}, 1000);
 
*/
 
event.preventDefault();
 
});
 
})
 
</script>
 
 
<script type="text/javascript">
 
 
$(window).load(function(){
 
 
 
 
 
  var $container = $('.portfolioContainer'),
 
      $body = $('body'),
 
      colW = 375,
 
      columns = null;
 
 
 
 
  $container.isotope({
 
    // disable window resizing
 
    resizable: true,
 
    masonry: {
 
      columnWidth: colW
 
    }
 
  });
 
 
 
  $(window).smartresize(function(){
 
    // check if columns has changed
 
    var currentColumns = Math.floor( ( $body.width() -30 ) / colW );
 
    if ( currentColumns !== columns ) {
 
      // set new column count
 
      columns = currentColumns;
 
      // apply width to container manually, then trigger relayout
 
      $container.width( columns * colW )
 
        .isotope('reLayout');
 
    }
 
   
 
  }).smartresize(); // trigger resize to set container width
 
  $('.portfolioFilter a').click(function(){
 
        $('.portfolioFilter .current').removeClass('current');
 
        $(this).addClass('current');
 
 
        var selector = $(this).attr('data-filter');
 
        $container.isotope({
 
 
            filter: selector,
 
        });
 
        return false;
 
    });
 
 
 
});
 
 
</script>
 
 
<style>
 
<style>
 
.firstHeading
 
.firstHeading
Line 653: Line 348:
 
   display:none;
 
   display:none;
 
}
 
}
 +
.com__section--text
 +
{
 +
  height:auto;
 +
  overflow:auto;
 +
}
 +
.com
 +
{
 +
  background-image:url( https://static.igem.org/mediawiki/2015/3/36/Fafu_5.JPG);
 +
  background-size:100%;
 +
  overflow-y:auto;
 +
}
 +
.com__content
 +
{
 +
  background-image:none;
 +
}
 +
table
 +
{
 +
  background-color:rgba(0,0,0,0);
 +
}
 +
</style>
 +
<script src="js/jquery-2.1.1.min.js" type="https://2015.igem.org/Template:FAFU_CHINA/guge/js/jquery-2-1-1-min?action=raw&amp;ctype=text/javascript"></script>
 +
<script>
 +
var link = $('.com__nav-link');
 +
var linkParent = link.parent('li');
 +
var section = $('.com__section');
 +
var sectionContent = section.find('*');
 +
var switchTab = function () {
 +
var p = $(this).parent('li');
 +
var i = p.index();
 +
var s = section.eq(i);
 +
var c = s.find('*');
 +
section.removeClass('active');
 +
sectionContent.removeAttr('style');
 +
s.addClass('active');
 +
c.css({
 +
transform: 'none',
 +
opacity: 1
 +
});
 +
linkParent.removeClass('active');
 +
p.addClass('active');
 +
return false;
 +
};
 +
link.on('click', switchTab);
 +
function activeFirst() {
 +
section.first().addClass('active');
 +
section.first().find('*').css({
 +
transform: 'none',
 +
opacity: 1
 +
});
 +
linkParent.first().addClass('active');
 +
}
 +
activeFirst();
 +
</script>
 +
<script type="text/javascript" src="https://2015.igem.org/Template:FAFU_CHINA/index2/js/bootstrap?action=raw&amp;ctype=text/javascript"></script>
 +
<style>
 
.team-leader
 
.team-leader
 
{
 
{
   width:60%;
+
   margin-left:10%;
   margin-left:18%;
+
   width:82%;
 
}
 
}
 
</style>
 
</style>
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 19:48, 17 September 2015

侧边栏

team

Walter White

Chief Executive Officer

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Jesse Pinkman

Product Manager

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Skyler white

Accountant

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Walter White

Chief Executive Officer

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Jesse Pinkman

Product Manager

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Skyler white

Accountant

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Walter White

Chief Executive Officer

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Jesse Pinkman

Product Manager

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Skyler white

Accountant

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Walter White

Chief Executive Officer

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Jesse Pinkman

Product Manager

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.

Skyler white

Accountant

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consequat sollicitudin cursus. Dolor sit amet, consectetur adipiscing elit proin consequat.