Team:BNU-China

From 2014.igem.org

(Difference between revisions)
 
(152 intermediate revisions not shown)
Line 1: Line 1:
-
 
+
{{Team:BNU-China/CSS/bootstrap.min.css}}
-
{{Team:BNU-China/javascripts}}
+
{{Team:BNU-China/CSS/main_new.css}}
-
 
+
<html>
-
<html lang="en-US">
+
<head>
<head>
-
<meta charset="UTF-8">
+
    <meta name="description" content="BNU-China, 2014,igem">
-
<script type="text/javascript" src="https://2014.igem.org/Team:BNU-China/js/jquery.prettyPhoto.js?action=raw"></script>
+
    <meta name="keywords" content="BNU,BNU-China,igem,ModA,chemotaxis,peanut">
-
<script type="text/javascript" src="https://2014.igem.org/Team:BNU-China/js/jquery.jcarousel.js?action=raw"></script>
+
    <meta name="author" content="刘兵LiuBing">
-
<script type="text/javascript" src="https://2014.igem.org/Team:BNU-China/js/jquery.prettyPhoto.js?action=raw"></script>
+
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-
 
+
    <link rel="shortcut icon" href="https://static.igem.org/mediawiki/2014/6/6a/Bnu_bktn2.png" type="image/x-icon" />
-
<script type="text/javascript">
+
    <link rel="icon" href="https://static.igem.org/mediawiki/2014/6/6a/Bnu_bktn2.png"sizes="32x32" />
-
jQuery(document).ready(function($){
+
    <link rel="icon" href="https://static.igem.org/mediawiki/2014/6/6a/Bnu_bktn2.png" sizes="64x64" />  
-
$('.forms').dcSlickForms();
+
    <link rel="icon" href="https://static.igem.org/mediawiki/2014/6/6a/Bnu_bktn2.png" sizes="128x128" />
-
});
+
    <script type="text/javascript" src="https://2014.igem.org/Team:BNU-China/js/jquery-1.10.2.min.js?action=raw"></script>
 +
    <script type="text/javascript" src="https://2014.igem.org/Team:BNU-China/js/bootstrap.min.js?action=raw"></script>
 +
    <script>
 +
//var loginFlag = false;
 +
//var loginHelper = null;
 +
$(document).ready(function(){
 +
$('.carousel').carousel(
 +
{
 +
"pause":"false",
 +
"interval":5000
 +
}
 +
        );
 +
 +
$('.carousel').on('slide.bs.carousel', function (event) {
 +
var tag = $(event.relatedTarget).attr("tag");
 +
var progress = $(event.relatedTarget).attr("progress");
 +
$('#img_home').attr("src", "https://static.igem.org/mediawiki/2014/9/92/Bnu_home.png");
 +
$('#img_intro').attr("src", "https://static.igem.org/mediawiki/2014/6/6a/Bnu_intro.png");
 +
$('#img_gift').attr("src", "https://static.igem.org/mediawiki/2014/e/e7/Bnu_gift.png");
 +
$('#img_feedback').attr("src", "https://static.igem.org/mediawiki/2014/f/fb/Bnu_feedback.png");
 +
$('#img_related').attr("src", "https://static.igem.org/mediawiki/2014/7/76/Bnu_related.png");
 +
//$('#img_' + tag).attr("src", "images/" + tag + "_selected.png");
 +
 +
//$("#progress").width(progress + "px");
 +
//$("#progress").css('left', (progress / 2) - 400 + "px");
 +
$("#progress").animate({width: progress, left: (progress / 2) - 400}, 500);
 +
playAnimation(tag);
 +
});
 +
$("body,html").animate({
 +
              scrollTop:($("#page_home .splash-container").offset().top)
 +
            },10);
 +
 +
playAnimation("home");
 +
 +
});
 +
 +
function switchPage(pageIndex){
 +
$('.carousel').carousel(pageIndex);
 +
}
 +
 +
function playAnimation(tag){
 +
var ani1 = $("#page_" + tag + " .ani_step_1");
 +
var ani2 = $("#page_" + tag + " .ani_step_2");
 +
var ani3 = $("#page_" + tag + " .ani_step_3");
 +
var pre_start = ((tag == "home") ? 0 : 300);
 +
if(ani1 != null){
 +
ani1.css("opacity", 0);
 +
setTimeout(function(){
 +
ani1.animate({opacity: 1}, 1000);
 +
}, 10 + pre_start);
 +
}
 +
if(ani2 != null){
 +
ani2.css("opacity", 0);
 +
setTimeout(function(){
 +
ani2.animate({opacity: 1}, 1000);
 +
}, 1500 + pre_start);
 +
}
 +
if(ani3 != null){
 +
ani3.css("opacity", 0);
 +
setTimeout(function(){
 +
$("#page_" + tag + " .ani_step_3").animate({opacity: 1}, 1000);
 +
}, 3000 + pre_start);
 +
}
 +
}
</script>
</script>
-
<script type="text/javascript">
+
<!--[if ls IE 7]>
-
 
+
<h2>Please make sure that JavaScript has to be activated for the page to display properly or you should update/change your browser.</h2>
-
$(document).ready(function()
+
<![endif]-->
-
{
+
-
$("#showcase").awShowcase(
+
-
{
+
-
content_width: 900,
+
-
content_height: 400,
+
-
auto: true,
+
-
interval: 3000,
+
-
continuous: false,
+
-
arrows: true,
+
-
buttons: true,
+
-
btn_numbers: true,
+
-
keybord_keys: true,
+
-
mousetrace: false, /* Trace x and y coordinates for the mouse */
+
-
pauseonover: true,
+
-
stoponclick: false,
+
-
transition: 'fade', /* hslide/vslide/fade */
+
-
transition_delay: 0,
+
-
transition_speed: 500,
+
-
show_caption: 'onload' /* onload/onhover/show */
+
-
});
+
-
});
+
-
 
+
-
</script>
+
-
 
+
-
 
+
</head>
</head>
<body>
<body>
-
<!-- Fullscreen backgrounds -->
+
<!--<p align="center" style="color: blue;">Coming soon ...</p>-->
-
<div id="thumbs">
+
<div id="carousel_container" class="carousel slide full_height">
-
<a href="style/images/art/bg1.jpg">1</a>
+
<div class="carousel-inner full_height">
-
<a href="style/images/art/bg2.jpg">2</a>
+
<div id="page_home" class="page item active" tag="home" progress="150">
-
<a href="style/images/art/bg3.jpg">3</a>
+
<div id="main">
-
<a href="style/images/art/bg4.jpg">4</a>
+
<div id="splash">
-
<a href="style/images/art/bg5.jpg">5</a>
+
<div class="container splash-container">
-
<a href="style/images/art/bg6.jpg">6</a>
+
<img src="https://static.igem.org/mediawiki/2014/7/70/Bnu_title.png" alt="E.coli Prometheus" class="ani_step_1"/>
-
</div>
+
<div id="download_btn_group" class="container ani_step_1">
-
<div id="superbgimage">
+
<div id="download_place_holder" class="horizental-item" ></div>
-
<div class="scanlines"></div>
+
<div class="horizental-item">
-
</div>
+
<a href="https://2014.igem.org/Team:BNU-China/home.html" id="splash_download_button" class="download-button">
-
<!-- End Fullscreen backgrounds -->
+
                                    <div class="download-title">
-
<!-- Begin Wrapper -->
+
                                    <img class="qrcode" src="https://static.igem.org/mediawiki/2014/1/18/Bnu_qrcode.png" alt="E.coli Prometheus" width="180px" height="180px"><br>
-
<div id="wrapper">
+
<span>Skip the Navigation</span>
-
  <div id="header">
+
</div>
-
    <div class="logo opacity"><a href="index.html"><img src="style/images/logo.png" alt="" /></a></div>
+
<div class="download-subtitle">
-
    <div align="right"><a href="https://2014.igem.org/Main_Page"><img src="IGEMsmall.png" width="45px" height="40px"></a></div>
+
I'll take you to Wiki Main Page Directly!
-
  </div>
+
</div>
-
  <div class="clear"></div>
+
</a>
-
  <!-- Begin Menu -->
+
</div>
-
  <div id="menu" class="menu opacity">
+
                           
-
    <ul>
+
</div>
-
      <li><a href="index.html">Home</a></li>
+
</div>
-
      <li><a href="#">Project</a>
+
</div>
-
        <ul>
+
</div>
-
        <li><a href="overview.html">Overview</a></li>
+
-
          <li><a href="modeling.html">Modeling</a></li>
+
-
            <li><a href="">...</a></li>
+
-
            <li><a href="">...</a></li>
+
-
        </ul>
+
-
      </li>
+
-
      <li><a href="#">Achievements</a>
+
-
        <ul>
+
-
        <li><a href="results.html">Experiment Results</a></li>
+
-
          <li><a href="parts.html">Submitted Parts</a></li>
+
-
          <li><a href="future.html">The Bright Future</a></li>
+
-
        </ul>
+
-
      </li>
+
-
      <li><a href="safety.html">Safety</a></li>
+
-
      <li><a href="#">Human Practice</a>
+
-
      <ul>
+
-
        <li><a href="collaboration.html">Collaboration</a></li>
+
-
        <li><a href="investigatin.html">Investigation</a></li>
+
-
        <li><a href="others.html">Others</a></li>
+
-
        </ul>
+
-
      </li>
+
-
      <li><a href="#">Our Team</a>
+
-
      <ul>
+
-
        <li><a href="profile.html">Team Profile</a></li>
+
-
            <li><a href="attributions.html">Attributions</a></li>
+
-
            <li><a href="time_axis.html">Time Axis</a></li>
+
-
            <li><a href="acknowledge.html">Acknowledge</a></li>
+
-
    </ul>
+
-
      </li>
+
-
    <br style="clear: left" />
+
-
  </div>
+
-
  <!-- End Menu -->
+
-
 
+
-
  <!-- Begin Container -->
+
-
  <div id="container" class="opacity">  
+
-
   
+
-
    <!-- Begin Showcase -->
+
-
    <div id="showcase" class="showcase">  
+
-
      <!-- Each child div in #showcase represents a slide -->
+
-
      <div class="showcase-slide">  
+
-
        <!-- Put the slide content in a div with the class .showcase-content. -->
+
-
        <div class="showcase-content"> <img src="style/images/art/s1.jpg" alt="1" /> </div>
+
-
      </div>
+
-
     
+
-
      <!-- Each child div in #showcase represents a slide -->
+
-
            <!--1-->
+
-
      <div class="showcase-slide"> 
+
-
        <!-- Put the slide content in a div with the class .showcase-content. -->
+
-
        <div class="showcase-content"> <img src="style/images/art/s2.jpg" alt="2" /> </div>
+
-
        <div class="showcase-caption">
+
-
Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit.
+
</div>
</div>
-
      </div>
+
<div id="page_intro" class="page item" tag="intro" progress="300">
-
      <!--2-->
+
<div id="main">
-
      <div class="showcase-slide">  
+
<div id="splash" class="ani_step_1">
-
        <div class="showcase-content"> <img src="style/images/art/s3.jpg" alt="3" /> </div>
+
<div class="container splash-container">
-
        <div class="showcase-caption">
+
<img src="https://static.igem.org/mediawiki/2014/a/a1/Bnu_intro_splash.jpg" alt="E.coli Prometheus feels so bad when he saw the Bad growth of peanuts" width="70%"/>
-
Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit.
+
</div>
 +
                   
 +
                    <a href="https://2014.igem.org/Team:BNU-China/pp_overview.html" id="splash_download_button" class="download-button ani_step_1">
 +
<div class="download-title">
 +
What happened to the peanut?&nbsp;&nbsp;<img src="https://static.igem.org/mediawiki/2014/9/94/Bnu_arrow_feedback.png" alt="To check out what happened to peanuts">
 +
</div>
 +
</a>
 +
</div>
 +
</div>
</div>
</div>
-
      </div>
+
<div id="page_gift" class="page item" tag="gift" progress="450">
-
      <!--3-->
+
<div id="main">
-
      <div class="showcase-slide">  
+
<div id="splash">
-
        <!-- Put the slide content in a div with the class .showcase-content. -->
+
<div class="container splash-container ani_step_1">
-
        <div class="showcase-content"> <img src="style/images/art/s4.jpg" alt="4" /> </div>
+
<img src="https://static.igem.org/mediawiki/2014/d/d6/Bnu_gift_splash.gif" alt="E.coli Prometheus transformed by BNU-iGEM" width="70%"/>
-
      </div>
+
</div>                   
-
      <!--4-->
+
<a href="https://2014.igem.org/Team:BNU-China/overview.html" id="splash_download_button" class="download-button ani_step_1">
-
      <div class="showcase-slide">  
+
<div class="download-title">
-
        <!-- Put the slide content in a div with the class .showcase-content. -->
+
How we did this&nbsp;&nbsp;<img src="https://static.igem.org/mediawiki/2014/8/87/Bnu_arrow_gift.png" alt="To check out hao we transform the e.coli">
-
        <div class="showcase-content"> <img src="style/images/art/s4.jpg" alt="4" /> </div>
+
</div>
-
        <div class="showcase-caption">
+
</a>                   
-
Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
+
</div>
 +
</div>
 +
</div>
 +
<div id="page_feedback" class="page item" tag="feedback" progress="600">
 +
<div id="main">
 +
<div id="splash">
 +
<div class="container splash-container ani_step_1">
 +
<img src="https://static.igem.org/mediawiki/2014/a/a8/Bnu_delivery.gif" alt="deliver the Mo to peanut" width="70%"/>
 +
</div>
 +
<a href="https://2014.igem.org/Team:BNU-China/Chemotaxis.html" id="splash_download_button" class="download-button ani_step_1">
 +
<div class="download-title">
 +
The delivery system&nbsp;&nbsp;<img src="https://static.igem.org/mediawiki/2014/9/94/Bnu_arrow_feedback.png" alt="To check out how the delivery system works">
 +
</div>
 +
</a>
 +
</div>
 +
</div>
 +
</div>
 +
<div id="page_related" class="page item" tag="related" progress="750">
 +
<div id="main">
 +
<div id="splash">
 +
<div class="container splash-container">
 +
<img src="https://static.igem.org/mediawiki/2014/0/05/Bnu_safety.gif" alt="E.coli Prometheus died for safety after deliver Mo to peanut" width="70%"/>
 +
</div>
 +
                    <a href="https://2014.igem.org/Team:BNU-China/safety-overview" id="splash_download_button" class="download-button ani_step_1">
 +
<div class="download-title">
 +
The Safety system&nbsp;&nbsp;<img src="https://static.igem.org/mediawiki/2014/9/94/Bnu_arrow_feedback.png" alt="To check out how the safety system works">
 +
</div>
 +
</a>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="footer" >
 +
    <div id="navbar">
 +
<div id="dash" ></div>
 +
<div id="progress"></div>
 +
<div id="navbtns" class="container" >
 +
<div class="navbtn">
 +
<a href="javascript:switchPage(0)">
 +
<img id="img_home" src="https://static.igem.org/mediawiki/2014/1/1c/Bnu_home_selected.png" alt="0">
 +
<div>Prometheus</div>
 +
</a>
 +
</div>
 +
<div class="navbtn">
 +
<a href="javascript:switchPage(1)">
 +
<img id="img_intro" src="https://static.igem.org/mediawiki/2014/6/6a/Bnu_intro.png" alt="1">
 +
<div>Peanut</div>
 +
</a>
 +
</div>
 +
<div class="navbtn">
 +
<a href="javascript:switchPage(2)">
 +
<img id="img_gift" src="https://static.igem.org/mediawiki/2014/e/e7/Bnu_gift.png" alt="2">
 +
<div>Armed</div>
 +
</a>
 +
</div>
 +
<div class="navbtn">
 +
<a href="javascript:switchPage(3)">
 +
<img id="img_feedback" src="https://static.igem.org/mediawiki/2014/f/fb/Bnu_feedback.png" alt="3">
 +
<div>Delivery</div>
 +
</a>
 +
</div>
 +
<div class="navbtn">
 +
<a href="javascript:switchPage(4)">
 +
<img id="img_related" src="https://static.igem.org/mediawiki/2014/7/76/Bnu_related.png" alt="4">
 +
<div>Safety</div>
 +
</a>
 +
</div>
</div>
</div>
-
      </div>
 
-
      <!--end of silde content-->
 
     </div>
     </div>
-
    <!-- End Showcase -->
 
-
   
 
-
    <div class="intro">Aenean fringilla aliquam est, a porttitor arcu euismod et. Maecenas rutrum erat at arcu porta interdum. Cras convallis ligula ac risus imperdiet placerat.</div>
 
-
    <div class="hr2"></div>
 
-
    <!-- Divider -->
 
-
   
 
-
    <!-- Begin Top Columns -->
 
-
    <h2>What We Do</h2>
 
-
    <div class="two-third">
 
-
      <p>Vivamus sodales pharetra libero, a tincidunt nisi condimentum a. Quisque non sodales nislero. Integer a tellus eget arcu fringilla molestie quis vel eros. Praesent fermentum vulputate purusa ornare. Vivamus imperdiet, quam et adipiscing placerat, nibh odio scelerisque risus, vitaere accumsan mi justo et quam. Pellentesque quis felis quis tortor porttitor lobortis nec ac risus.</p>
 
-
    </div>
 
-
    <div class="one-third last">
 
-
      <ul>
 
-
        <li>Vivamus at magna non ipsum.</li>
 
-
        <li>Etiam pharetra pretium eros.</li>
 
-
        <li>Curabitur porttitor ipsum nec magna.</li>
 
-
        <li>Maecenas cursus arcu a nulla tristique.</li>
 
-
      </ul>
 
-
    </div>
 
-
    <!-- End Top Columns -->
 
-
   
 
-
    <div class="clear"></div>
 
-
    <br />
 
-
    <br />
 
-
    <br />
 
-
   
 
-
    <!-- Begin 4 Columns -->
 
-
   
 
-
    <div class="one-fourth"> <img src="style/images/icon1.png" alt="" class="center" /><br />
 
-
      <h4 class="center">Web Design</h4>
 
-
      <p class="center">Vivamus soder pharetra libero atincidunt, nisi condimentum Quisque non sodales nislero.</p>
 
-
    </div>
 
-
    <div class="one-fourth"> <img src="style/images/icon2.png" alt="" class="center" /><br />
 
-
      <h4 class="center">Photography</h4>
 
-
      <p class="center">Vivamus soder pharetra libero atincidunt, nisi condimentum Quisque non sodales nislero.</p>
 
-
    </div>
 
-
    <div class="one-fourth"> <img src="style/images/icon3.png" alt="" class="center" /><br />
 
-
      <h4 class="center">Motion Graphic</h4>
 
-
      <p class="center">Vivamus soder pharetra libero atincidunt, nisi condimentum Quisque non sodales nislero.</p>
 
-
    </div>
 
-
    <div class="one-fourth last"> <img src="style/images/icon4.png" alt="" class="center" /><br />
 
-
      <h4 class="center">Optimization</h4>
 
-
      <p class="center">Vivamus soder pharetra libero atincidunt, nisi condimentum Quisque non sodales nislero.</p>
 
-
    </div>
 
-
    <div class="clear"></div>
 
-
    <div class="hr1"></div>
 
-
    <!-- Divider -->
 
-
   
 
-
    <!-- Begin Latest Works -->
 
-
    <h2>Latest Works</h2>
 
-
    <div class="carousel">
 
-
      <div id="carousel-scroll"><a href="#" id="prev">Prev</a><a href="#" id="next">Next</a></div>
 
-
      <ul>
 
-
        <li> <a href="#"> <span>describe</span><img src="style/images/art/c1.jpg" alt="" /> </a> </li>
 
-
        <li> <a href="#"> <span>describe</span><img src="style/images/art/c2.jpg" alt="" /> </a> </li>
 
-
        <li> <a href="#"> <span>describe</span><img src="style/images/art/c3.jpg" alt="" /> </a> </li>
 
-
        <li> <a href="#"> <span>describe</span><img src="style/images/art/c4.jpg" alt="" /> </a> </li>
 
-
        <li> <a href="#"> <span>describe</span><img src="style/images/art/c5.jpg" alt="" /> </a> </li>
 
-
        <li> <a href="#"> <span>describe</span><img src="style/images/art/c6.jpg" alt="" /> </a> </li>
 
-
      </ul>
 
-
    </div>
 
-
    <!-- End Latest Works -->
 
-
   
 
-
    <div id="footer">
 
-
      <div class="footer-top"></div>
 
-
      <div class="clear"></div>
 
-
        <!--sponsor-->
 
-
        <div class="two-third">
 
-
        <h3>Our Sponsors</h3>
 
-
        <ul class="flickr">
 
-
          <li><a href="#"><img src="style/images/art/f1.jpg" alt="" /></a></li>
 
-
          <li><a href="#"><img src="style/images/art/f2.jpg" alt="" /></a></li>
 
-
          <li><a href="#"><img src="style/images/art/f3.jpg" alt="" /></a></li>
 
-
          <li><a href="#"><img src="style/images/art/f4.jpg" alt="" /></a></li>
 
-
          <li><a href="#"><img src="style/images/art/f5.jpg" alt="" /></a></li>
 
-
          <li><a href="#"><img src="style/images/art/f6.jpg" alt="" /></a></li>
 
-
          <li><a href="#"><img src="style/images/art/f7.jpg" alt="" /></a></li>
 
-
          <li><a href="#"><img src="style/images/art/f8.jpg" alt="" /></a></li>
 
-
          <li><a href="#"><img src="style/images/art/f9.jpg" alt="" /></a></li>
 
-
        </ul>
 
-
      </div>
 
-
      </div>
 
-
      <div class="clear"></div>
 
-
    </div>
 
-
  </div>
 
-
  <!-- End Container -->
 
-
 
 
-
  <div id="copyright" class="opacity">
 
-
    <p>E.coli Prometheus: I live for the trees and die for safety</p>
 
-
  </div>
 
</div>
</div>
-
<!-- End Wrapper -->
 
-
<script type="text/javascript">
 
-
/*-----------------------------------------------------------------------------------*/
 
-
/* BACKGROUND IMAGE
 
-
/*-----------------------------------------------------------------------------------*/
 
-
 
-
$(function() {
 
-
 
-
// Options for SuperBGImage
 
-
$.fn.superbgimage.options = {
 
-
randomtransition: 2, // 0-none, 1-use random transition (0-7)
 
-
z_index: -1, // z-index for the container
 
-
slideshow: 1, // 0-none, 1-autostart slideshow
 
-
slide_interval: 4000, // interval for the slideshow
 
-
randomimage: 1, // 0-none, 1-random image
 
-
speed: 'slow' // animation speed
 
-
};
 
-
 
-
// initialize SuperBGImage
 
-
$('#thumbs').superbgimage().hide();
 
-
 
-
});
 
-
/*-----------------------------------------------------------------------------------*/
 
-
/* MENU
 
-
/*-----------------------------------------------------------------------------------*/
 
-
 
-
ddsmoothmenu.init({
 
-
mainmenuid: "menu",
 
-
orientation: 'h',
 
-
classname: 'menu',
 
-
contentsource: "markup"
 
-
})
 
-
 
-
 
-
/*-----------------------------------------------------------------------------------*/
 
-
/* IMAGE HOVER
 
-
/*-----------------------------------------------------------------------------------*/
 
-
$(function() {
 
-
$('.flickr img, .blog a img, #.container a img, .content a img').css("opacity","1.0");
 
-
$('.flickr img, .blog a img, #container a img, .content a img').hover(function () {  
 
-
$(this).stop().animate({ opacity: 0.75 }, "fast"); },
 
-
function () {
 
-
$(this).stop().animate({ opacity: 1.0 }, "fast");
 
-
});
 
-
});
 
-
 
-
 
-
/*-----------------------------------------------------------------------------------*/
 
-
/* OPACITY
 
-
/*-----------------------------------------------------------------------------------*/
 
-
 
-
$('.opacity').transify({opacityOrig:.90, percentHeight:'100%'});
 
-
 
-
/*-----------------------------------------------------------------------------------*/
 
-
/* PRETTYPHOTO
 
-
/*-----------------------------------------------------------------------------------*/
 
-
 
-
$(document).ready(function(){
 
-
$("a[rel^='prettyPhoto']").prettyPhoto({autoplay_slideshow: false, overlay_gallery: false, social_tools:false, deeplinking: false, theme:'pp_default', slideshow:5000});
 
-
});
 
-
 
-
/*-----------------------------------------------------------------------------------*/
 
-
/* TOGGLE
 
-
/*-----------------------------------------------------------------------------------*/
 
-
$(document).ready(function(){
 
-
//Hide the tooglebox when page load
 
-
$(".togglebox").hide();
 
-
//slide up and down when click over heading 2
 
-
$("h2").click(function(){
 
-
// slide toggle effect set to slow you can set it to fast too.
 
-
$(this).toggleClass("active").next(".togglebox").slideToggle("slow");
 
-
return true;
 
-
});
 
-
});
 
-
 
-
/*-----------------------------------------------------------------------------------*/
 
-
/* TABS
 
-
/*-----------------------------------------------------------------------------------*/
 
-
$(document).ready(function() {
 
-
//Default Action
 
-
$(".tab_content").hide(); //Hide all content
 
-
$("ul.tabs li:first").addClass("active").show(); //Activate first tab
 
-
$(".tab_content:first").show(); //Show first tab content
 
-
 
-
//On Click Event
 
-
$("ul.tabs li").click(function() {
 
-
$("ul.tabs li").removeClass("active"); //Remove any "active" class
 
-
$(this).addClass("active"); //Add "active" class to selected tab
 
-
$(".tab_content").hide(); //Hide all tab content
 
-
var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
 
-
$(activeTab).fadeIn(); //Fade in the active content
 
-
return false;
 
-
});
 
-
 
-
});
 
-
 
-
/*-----------------------------------------------------------------------------------*/
 
-
/* IMAGE HOVER
 
-
/*-----------------------------------------------------------------------------------*/
 
-
$(document).ready(function() {
 
-
        $('.box, .carousel ul li').mouseenter(function(e) {
 
-
 
-
            $(this).children('a').children('span').fadeIn(200);
 
-
        }).mouseleave(function(e) {
 
-
 
-
            $(this).children('a').children('span').fadeOut(200);
 
-
        });
 
-
    });
 
-
 
-
</script>
 
</body>
</body>
</html>
</html>

Latest revision as of 16:57, 17 October 2014

Retrieved from "http://2014.igem.org/Team:BNU-China"