Difference between revisions of "Team:Nankai/Practices/iShare"

 
(180 intermediate revisions by 2 users not shown)
Line 1: Line 1:
<html >
 
<!--Important:clear page-->
 
<script>    $('head').empty(); </script>
 
<!--End clear page-->
 
  
 +
<html lang="en">
 
<head>
 
<head>
<title>Home</title>
+
   
<link href="https://2015.igem.org/Template:Nankai/bootstrap_newCSS?action=raw&ctype=text/css" rel='stylesheet' type='text/css'/>
+
<link href="https://2015.igem.org/Template:Nankai/bootstrap.min_newCSS?action=raw&ctype=text/css" rel='stylesheet' type='text/css' />
+
<link href="https://2015.igem.org/Template:Nankai/styleCSS?action=raw&ctype=text/css" rel="stylesheet" type="text/css" media="all"/>
+
<script src="https://2015.igem.org/Template:Nankai/jquery.easing.minJS?action=raw&ctype=text/javascript"></script>
+
<link href='http://fonts.useso.com/css?family=Raleway:400,100,300,500,700,800,900,600,200' rel='stylesheet' type='text/css'>
+
<meta name="viewport" content="width=device-width, initial-scale=1">
+
<meta name="keywords" content="Agro Agency Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template,
+
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
+
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
+
<script src="https://2015.igem.org/Template:Nankai/jquery.minJS?action=raw&ctype=text/javascript"> </script>
+
<!---- start-smoth-scrolling---->
+
<script type="text/javascript" src="https://2015.igem.org/Template:Nankai/move-topJS?action=raw&ctype=text/javascript/"></script>
+
<script type="text/javascript" src="https://2015.igem.org/Template:Nankai/easingJS?action=raw&ctype=text/javascript"></script>
+
<script type="text/javascript">
+
jQuery(document).ready(function($) {
+
$(".scroll").click(function(event){
+
event.preventDefault();
+
$('html,body').animate({scrollTop:$(this.hash).offset().top},900);
+
});
+
});
+
</script>
+
<!---- start-smoth-scrolling---->
+
  
<!----//requred-js-files---->
+
<link href="https://2015.igem.org/Team:Nankai/Practices/iShare/bootstrapcss3?action=raw&ctype=text/css" rel="stylesheet">
<script type="text/javascript" src="https://2015.igem.org/Template:Nankai/jquery.smintJS?action=raw&ctype=text/javascript"></script>
+
  <link href="https://2015.igem.org/Team:Nankai/Practices/iShare/stylecss?action=raw&ctype=text/css" rel="stylesheet">
<script type="text/javascript">
+
<!-- Font awesome icon -->
$(document).ready( function() {
+
  <link rel="stylesheet" href="https://2015.igem.org/Team:Nankai/Practices/iShare/font-awesomecss?action=raw&ctype=text/css">
    $('.subMenu').smint({
+
  <!-- Flexslider -->
    'scrollSpeed' : 1000
+
  <link rel="stylesheet" href="https://2015.igem.org/Team:Nankai/Practices/iShare/flexslidercss?action=raw&ctype=text/css">  
    });
+
  <!-- prettyPhoto -->
});
+
<link rel="stylesheet" href="https://2015.igem.org/Team:Nankai/Practices/iShare/prettyPhotocss?action=raw&ctype=text/css">
</script>
+
<!-- Bootstrap responsive -->
<style>
+
<link href="https://2015.igem.org/Team:Nankai/Practices/iShare/bootstrap-responsivecss?action=raw&ctype=text/css" rel="stylesheet">
  
  /*Clear existing style*/
 
  
 +
 +
 +
  <!-- Stylesheets -->
 +
 
 +
 +
<script src="https://2015.igem.org/Team:Nankai/Practices/iShare/jqueryjs?action=raw&ctype=text/javascript"></script>
 +
<script src="https://2015.igem.org/Team:Nankai/Practices/iShare/bootstrapjs?action=raw&ctype=text/javascript"></script> <!-- Bootstrap -->
 +
<script src="https://2015.igem.org/Team:Nankai/Practices/iShare/imageloadedjs?action=raw&ctype=text/javascript"></script> <!-- Imageloaded -->
 +
<script src="https://2015.igem.org/Team:Nankai/Practices/iShare/jqueryisotopejs?action=raw&ctype=text/javascript"></script> <!-- Isotope -->
 +
<script src="https://2015.igem.org/Team:Nankai/Practices/iShare/jqueryprettyPhotojs?action=raw&ctype=text/javascript"></script> <!-- prettyPhoto -->
 +
<script src="https://2015.igem.org/Team:Nankai/Practices/iShare/jqueryflexslider-minjs?action=raw&ctype=text/javascript"></script> <!-- Flexslider -->
 +
<script src="https://2015.igem.org/Team:Nankai/Practices/iShare/customjs?action=raw&ctype=text/javascript"></script><!-- Main js file -->
 +
 +
 +
 +
 +
 +
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 +
  <meta charset="utf-8">
 +
  <!-- Title and other stuffs -->
 +
  <title>Nankai iShare</title>
 +
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 +
  <meta name="description" content="">
 +
  <meta name="keywords" content="">
 +
  <meta name="author" content="">
 +
 +
 +
 
 +
  <!-- HTML5 Support for IE -->
 +
  <!--[if lt IE 9]>
 +
  <script src="js/html5shim.js"></script>
 +
  <![endif]-->
 +
 +
  <!-- Favicon -->
 +
  <link rel="shortcut icon" href="img/favicon/favicon.png">
 +
  <style type="text/css">
 +
 
 +
 +
  /*Clear existing style*/
  
 
   #contentSub, #menubar, #footer-box, #siteSub, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading, .visualClear {
 
   #contentSub, #menubar, #footer-box, #siteSub, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading, .visualClear {
Line 53: Line 66:
  
 
   }
 
   }
 +
.col-1 h5{
 +
font-size:108%;
 +
font-weight:100;
 +
line-height:113%;
 +
font-family:'Times New Roman',Gill Sans,Lucida Sans,Consolas
 +
}
 +
 
   /*End claer*/
 
   /*End claer*/
  
 
+
  </style>
 
+
 
</head>
 
</head>
 +
 
<body>
 
<body>
<!--body-->
 
  
 +
 +
 +
 +
 +
 +
<!-- Main content starts -->
 +
 +
<div class="content">
 +
 +
  <!-- Sidebar starts -->
 +
  <div class="sidebar">
 +
 +
    <!-- Logo -->
 +
    <div class="logo">
 +
      <img src="https://static.igem.org/mediawiki/2015/c/c3/Nankai_iShare_B-logo.png" alt="" />
 +
    </div>
 +
 +
 +
 +
        <div class="sidebar-dropdown"><a href="#">Navigation</a></div>
 +
 +
        <!--- Sidebar navigation -->
 +
        <!-- If the main navigation has sub navigation, then add the class "has_sub" to "li" of main navigation. -->
 +
 +
        <!-- Colors: Add the class "br-red" or "br-blue" or "br-green" or "br-orange" or "br-purple" or "br-yellow" to anchor tags to create colorful left border -->
 +
        <div class="s-content">
 +
 +
        <ul id="nav">
 +
            <!-- Main menu with font awesome icon -->
 +
            <li><a href="https://2015.igem.org/Team:Nankai/Practices/iShare" class="open br-red"><i class="icon-home"></i> iShare Gallery</a>
 +
      <li><a href="https://2015.igem.org/Team:Nankai/Practices/iShare stage" "  class="open br-red"><i class="icon-home"></i> iShare Stage  </a>        <!-- Sub menu markup
 +
              <ul>
 +
                <li><a href="#">Submenu #1</a></li>
 +
                <li><a href="#">Submenu #2</a></li>
 +
                <li><a href="#">Submenu #3</a></li>
 +
              </ul>-->
 +
           
 +
 +
           
 +
 +
          <li><a href="https://2015.igem.org/Team:Nankai/Practices/About Us" class="br-blue"><i class="icon-user"></i> About Us</a></li>
 +
            <li><a href="https://2015.igem.org/Team:Nankai/Practices/Contact us" class="br-yellow"><i class="icon-envelope-alt"></i> Contact Us</a></li>
 +
          </ul>
 +
           
 +
           
 +
 +
           
 +
           
 +
          <!-- Sidebar widget -->
 +
           
 +
            <div class="s-widget">
 +
              <h4><span style="color: #FFFFFF">Nankai iShare</h4>
 +
              <h5> <span style="color: #FFFFFF">A brand new idea raised up by Nankai Team in 2014, iShare is an information-sharing platform aiming to converge all information of iGEM China teams involved in our experiment such as Topic, Introduction, Materials and Methods, Progression, Parts </h5>
 +
            </div>
 +
 +
        </div>
 +
 +
       
 +
 +
  </div>
 +
  <!-- Sidebar ends -->
 +
  <!-- Sidebar ends -->
 +
 +
  <!-- Mainbar starts -->
 +
  <div class="mainbar">
 +
        <!-- Title starts -->
 +
        <div class="page-title">
 +
          <h2>iShare Gallery<span>See your team's beauty!</span></h2>
 +
        </div>
 +
 +
<!-- Title ends -->
 +
 +
        <!-- Content starts -->
 +
 +
     
 +
                    </div>
 +
 +
  <!-- Mainbar starts -->
 +
  <div class="mainbar">             
 +
    <div class="matter">
 +
      <div class="container-fluid">
 
 
<!---- start-portfolio-script----->
+
                    <div id="portfolio-one">
<script src="js/hover_pack.js"></script>
+
                   
<script type="text/javascript" src="js/jquery.mixitup.min.js"></script>
+
 
<script type="text/javascript">
+
                      <!-- Element -->
$(function () {
+
 
var filterList = {
+
                      <div class="element">
init: function () {
+
                        <a href="https://2015.igem.org/Team:Nankai/Practices/iShare/Nankai/Sharing" target="_blank">
+
                          <!-- Image -->
// MixItUp plugin
+
                          <img src="https://static.igem.org/mediawiki/2015/5/52/IShare_HP_Nankai.jpg" alt=""/>
// http://mixitup.io
+
                          <!-- Content -->
$('#portfoliolist').mixitup({
+
                          <span class="image-info">
targetSelector: '.portfolio',
+
                            <!-- Title -->
filterSelector: '.filter',
+
                              <span class="image-title">Nankai University</span>
effects: ['fade'],
+
                            <!-- Desc -->
easing: 'snap',
+
                              <span class="image-desc">   A key multidisciplinary and research-oriented university directly under the jurisdiction of the Ministry of Education</span>
// call the hover effect
+
                          </span>
onMixEnd: filterList.hoverEffect()
+
                        </a>
});
+
                      </div>
+
 
},
+
 
hoverEffect: function () {
+
                      <div class="element">
// Simple parallax effect
+
                        <a href="https://2015.igem.org/Team:Nankai/Practices/iShare/Shenzhen/Sharing" target="_blank">
$('#portfoliolist .portfolio').hover(
+
                          <!-- Image -->
function () {
+
                          <img src="https://static.igem.org/mediawiki/2015/9/9f/Nankai_iShare_Shenzhen.jpg" alt=""/>
$(this).find('.label').stop().animate({bottom: 0}, 200, 'easeOutQuad');
+
                          <!-- Content -->
$(this).find('img').stop().animate({top: -30}, 500, 'easeOutQuad');
+
                          <span class="image-info">
},
+
                            <!-- Title -->
function () {
+
                              <span class="image-title">Shenzhen University</span>
$(this).find('.label').stop().animate({bottom: -40}, 200, 'easeInQuad');
+
                            <!-- Desc -->
$(this).find('img').stop().animate({top: 0}, 300, 'easeOutQuad');
+
                              <span class="image-desc">Shenzhen University (SZU) was founded as a public university on May 10th,1983 with the accreditation of the State Council of the People's Republic of China</span>
}
+
                          </span>
);
+
                        </a>
+
                      </div>
}
+
 
+
                      <div class="element">
};
+
                        <a href="https://2015.igem.org/Team:Nankai/Practices/iShare/OUC/Sharing" target="_blank">
// Run the show!
+
                          <!-- Image -->
filterList.init();
+
                          <img src="https://static.igem.org/mediawiki/2015/5/5a/IShare_HP_OUC.jpg" alt=""/>
});
+
                          <!-- Content -->
</script>
+
                          <span class="image-info">
<!----//End-portfolio-script----->
+
                            <!-- Title -->
<ul id="filters" class="clearfix">
+
                              <span class="image-title">Ocean University of China</span>
<li><span class="filter active" data-filter="app card icon">All</span></li>
+
                            <!-- Desc -->
<li><span class="filter" data-filter="app">Seeds</span></li>
+
                              <span class="image-desc">Ocean University of China (OUC) is a comprehensive university with particular strengths in oceanography and fisheries science.</span>
<li><span class="filter" data-filter="card">Croping</span></li>
+
                          </span>
<li><span class="filter" data-filter="icon">Development</span></li>
+
                        </a>
</ul>
+
                      </div>      
<div id="portfoliolist">
+
        </div>
<div class="portfolio app mix_all" data-cat="logo" style="display: inline-block; opacity: 1;">
+
      </div>
<div class="portfolio-wrapper">
+
    </div>
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go  thickbox">
+
    </div>
    <img src="images/p1.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/link-ico.png" alt=""/></h2>
+
                   
  </div></a>
+
</div>
                </div>
+
</div>
+
  <!-- Mainbar ends -->
<div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
+
<div class="clearfix"></div>
<div class="portfolio-wrapper">
+
  <!-- Foot starts -->            
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go  thickbox">
+
    <div class="foot">
    <img src="images/p2.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/link-ico.png" alt=""/></h2>
+
  <div class="bor"></div>
  </div></a>
+
      <div class="container-fluid">
                </div>
+
        <div class="row-fluid">
</div>
+
         
<div class="portfolio card mix_all" data-cat="web" style="display: inline-block; opacity: 1;">
+
            <div class="span4">
<div class="portfolio-wrapper">
+
              <div class="fwidget">
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go  thickbox">
+
 
    <img src="images/p3.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/link-ico.png" alt=""/></h2>
+
                <div class="col-l">
  </div></a>
+
                  <h5><span style="color: #FFFFFF">Link</h5>
                </div>
+
                  <ul>
</div>
+
                    <li><a href="https://2015.igem.org/Team:Nankai" target="_blank">Home</a></li>
<div class="portfolio icon mix_all" data-cat="icon" style="display: inline-block; opacity: 1;">
+
                    <li><a href="https://2015.igem.org/Team:Nankai/Description" target="_blank">Research & Lab</a></li>
<div class="portfolio-wrapper">
+
                    <li><a href="https://2015.igem.org/Team:Nankai/Team" target="_blank">Team</a></li>
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go  thickbox">
+
                    <li><a href="https://2015.igem.org/Team:Nankai/Practices" target="_blank">Human Practice</a></li>
    <img src="images/p4.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/link-ico.png" alt=""/></h2>
+
                    <li><a href="https://2015.igem.org/Team:Nankai/Modeling" target="_blank">Model</a></li>
  </div></a>
+
                  </ul>
                </div>
+
                </div>
</div>
+
 
<div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
+
                <div class="col-r">
<div class="portfolio-wrapper">
+
                  <h5><span style="color: #FFFFFF">Support</h5>
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go  thickbox">
+
                  <ul>
    <img src="images/p8.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/link-ico.png" alt=""/></h2>
+
                    <li><a href="http://english.nankai.edu.cn/" target="_blank">Nankai University</a></li>
  </div></a>
+
                    <li><a href="http://sky.nankai.edu.cn/" target="_blank">College of Life Science</a></li>
                </div>
+
                                      </ul>
</div>
+
                </div>
<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
+
<div class="portfolio-wrapper">
+
<div class="clearfix"></div>
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go  thickbox">
+
 
    <img src="images/p6.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/link-ico.png" alt=""/></h2>
+
              </div>
  </div></a>
+
            </div>
                </div>
+
 
</div>
+
         
<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
+
            <div class="span4">
<div class="portfolio-wrapper">
+
              <div class="fwidget">
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go  thickbox">
+
                <h5><span style="color: #FFFFFF">Know our project</h5>
    <img src="images/p7.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/link-ico.png" alt=""/></h2>
+
                <ul>
  </div></a>
+
                  <li><a href="https://2015.igem.org/Team:Nankai/Description" target="_blank">Nankai iGEM_Description</a></li>
                </div>
+
                  <li><a href="https://2015.igem.org/Team:Nankai/Experiments" target="_blank">Experiment & Protocol</a></li>
</div>
+
                  <li><a href="https://2015.igem.org/Team:Nankai/Results" target="_blank">Results</a></li>
<div class="portfolio icon mix_all" data-cat="icon" style="display: inline-block; opacity: 1;">
+
                  <li><a href="https://2015.igem.org/Team:Nankai/Design" target="_blank">Design</a></li>
<div class="portfolio-wrapper">
+
                  <li><a href="https://2015.igem.org/Team:Nankai/pudding_health_kit" target="_blank">Pudding Health Kit</a></li>
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go  thickbox">
+
                </ul>
    <img src="images/p5.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/link-ico.png" alt=""/></h2>
+
              </div>
  </div></a>
+
            </div>
                </div>
+
 
</div>
+
        </div>
<div class="clearfix"> </div>
+
</div>
+
<div class="row-fluid">
</div>
+
<div class="span12">
<!----//End-portfolio---->
+
<hr class="visible-desktop">
<script src="js/bootstrap.min.js"></script>
+
<div class="copy"><span style="color: #FFFFFF">Co</span><span style="color: #FFFFFF">pyright 2015 Nankai iGEM&copy; -<a href="https://2015.igem.org/Team:Nankai" target="_blank">Team Nankai</a>- More Information&nbsp;<a href="https://2015.igem.org/Team:Nankai" target="_blank">Nankai iGEM</a></span></div>
<!----start-model-box---->
+
</div>
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#"> </a>
+
<div class="modal fade bs-example-modal-md light-box" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
+
  <div class="modal-dialog modal-md">
+
    <div class="modal-content light-box-info">
+
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><img src="images/close.png" title="close" /></button>
+
    <h3>Place Yours content here</h3>
+
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris egestas orci et blandit dictum. Interdum et malesuada fames ac ante ipsum primis in faucibus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque posuere diam et est hendrerit, eget sodales lectus tincidunt. Etiam suscipit orci sapien, at molestie lorem imperdiet vitae. Fusce nunc eros, congue non hendrerit sed, lobortis scelerisque magna. Ut in nunc sem. Integer bibendum enim et erat molestie, sed interdum nisl ultricies. In hac habitasse platea dictumst. Nullam sem diam, tincidunt dapibus tellus pulvinar, pulvinar tempus dui. Integer eu faucibus arcu. Duis adipiscing commodo ipsum dapibus elementum.</p>
+
    </div>
+
  </div>
+
</div>
+
<!----start-model-box---->
+
<!----start-contact---->
+
<!---testmonials---->
+
<div class="testmonials section s3">
+
<div class="container">
+
<div class="bs-example">
+
    <div id="myCarousel" class="carousel slide" data-interval="3000" data-ride="carousel">
+
    <!-- Carousel indicators -->
+
        <ol class="carousel-indicators pagenate-icons">
+
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
+
            <li data-target="#myCarousel" data-slide-to="1"></li>
+
            <li data-target="#myCarousel" data-slide-to="2"></li>
+
        </ol>  
+
      <!-- Carousel items -->
+
        <div class="carousel-inner">
+
            <div class="active item">
+
              <img src="images/people.jpg" title="name" />
+
                <div class="carousel-caption caption">
+
                  <h3>Dan Cederholm</h3>
+
                  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p>
+
                </div>
+
            </div>
+
            <div class="item">
+
              <img src="images/people.jpg" title="name" />
+
                <div class="carousel-caption caption">
+
                  <h3>Dan Cederholm</h3>
+
                  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p>
+
                </div>
+
            </div>
+
            <div class="item">
+
                <img src="images/people.jpg" title="name" />
+
                <div class="carousel-caption caption">
+
                  <h3>Dan Cederholm</h3>
+
                  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p>
+
                </div>
+
            </div>
+
        </div>
+
        <!-- Carousel nav -->
+
    </div>
+
</div>
+
</div>
+
 
</div>
 
</div>
<!---testmonials---->
+
<!----start-contact---->
+
      </div>
 +
    </div>
 +
  <!-- Foot ends -->
  
<div class="copy-right">
 
<p>Copyright &copy; 2015.Company name All rights reserved.<a target="_blank" href="http://www.cssmoban.com/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a> - Collect from <a href="http://www.cssmoban.com/" >企业网站模板</a></p>
 
</div>
 
</div>
 
 
</div>
 
</div>
 +
 +
<div class="clearfix"></div>
 +
 +
<!-- Main content ends -->
 +
 +
 +
 +
<!-- Scroll to top -->
 +
<span class="totop"><a href="#"><i class="icon-chevron-up"></i></a></span>
 +
 +
 +
<!-- JS -->
 +
 +
 +
</body>
 +
</html>

Latest revision as of 22:56, 18 September 2015

Nankai iShare