Team:USTC-China
From 2014.igem.org
(Difference between revisions)
m |
|||
Line 2: | Line 2: | ||
<html> | <html> | ||
<main id="main"> | <main id="main"> | ||
- | <!-- PJAX Content Start --> | + | <!-- PJAX Content Start --> |
<p id="metadata"> | <p id="metadata"> | ||
{ | { | ||
- | + | "title" : "Homepage | USTC-China" | |
} | } | ||
- | <!-- Navbar --> | + | </p> |
- | + | <!-- Navbar --> | |
- | + | <img src="https://static.igem.org/mediawiki/2014/2/22/Color_bar.jpg" class="float-pic" /> | |
- | + | <img src="https://static.igem.org/mediawiki/2014/6/61/Color_bar3.jpg" class="float-pic" id="color-bar-3" /> | |
- | + | ||
- | + | <nav class="top-bar foundation-bar" data-topbar data-options="sticky_on: large"> | |
- | + | <ul class="title-area"> | |
+ | <li class="name"> | ||
+ | <h1><a href="index.html">USTC-iGEM</a></h1> | ||
+ | </li> | ||
+ | <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li> | ||
+ | </ul> | ||
+ | <section class="top-bar-section"> | ||
+ | <ul class="right"> | ||
+ | <li id="li-1"> | ||
+ | <a href="project.html">Project</a> | ||
+ | </li> | ||
+ | <li id="li-2"> | ||
+ | <a href="parts.html">Parts</a> | ||
+ | </li> | ||
+ | <li id="li-3"> | ||
+ | <a href="project.html">Notebook</a> | ||
+ | </li> | ||
+ | <li id="li-4"> | ||
+ | <a href="project.html">Human Practice</a> | ||
</li> | </li> | ||
- | |||
</ul> | </ul> | ||
- | + | </section> | |
- | + | </nav> | |
- | + | ||
- | + | <div class="row" id="content"> | |
- | + | <!-- Left Section --> | |
- | + | <div class="large-3 columns"> | |
- | + | ||
- | + | <section id="intro"> | |
- | + | <h1> USTC China </h1> | |
- | + | <h4>Touch enabled jQuery plugin that lets you create beautiful responsive carousel slider.</h4> | |
- | + | <br> | |
- | + | <a class="button success" href="#">Click for More</a> | |
- | + | ||
- | + | ||
- | + | ||
</section> | </section> | ||
- | + | </div> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | <!-- Right Section --> | |
- | + | <div class="large-9 columns"> | |
- | + | <div class="owl-carousel"> | |
- | + | <div class="item"> | |
- | + | <img src="http://placehold.it/900x400"> | |
- | + | </div> | |
- | + | <div class="item"> | |
- | + | <img src="http://placehold.it/900x400"> | |
- | + | </div> | |
- | + | <div class="item"> | |
- | + | <img src="http://placehold.it/900x400"> | |
- | + | ||
</div> | </div> | ||
</div> | </div> | ||
</div> | </div> | ||
+ | </div> | ||
- | + | <!-- Footer --> | |
- | + | <div class="footer"> | |
- | + | <div class="row"> | |
- | + | © 2014 USTC-iGEM Design. Distributed under <a href="http://creativecommons.org/licenses/by-sa/3.0/">BY-SA 3.0</a><br><br> | |
- | + | <a><img src="https://static.igem.org/mediawiki/2014/3/3a/GitHub.png"></a> | |
- | + | <a><img src="https://static.igem.org/mediawiki/2014/4/41/Renren.png"></a> | |
- | + | <a><img src="https://static.igem.org/mediawiki/2014/5/57/Weibo.png"></a> | |
- | + | <a><img src="https://static.igem.org/mediawiki/2014/f/fe/Mail.png"></a> | |
- | + | ||
</div> | </div> | ||
- | + | </div> | |
- | + | <!-- Resource --> | |
- | + | <script src="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.4.6/js/vendor/jquery.js"></script> | |
- | + | <script src="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.4.6/js/foundation/foundation.min.js"></script> | |
- | + | <script>$(document).foundation();</script> | |
- | + | <script src="http://ustc-igem.sacheo-dev.freeshell.ustc.edu.cn/owl2/owl.carousel.min.js"></script> | |
- | + | <script> | |
- | + | $('.owl-carousel').owlCarousel({ | |
- | + | animateOut: 'slideOutDown', | |
- | + | animateIn: 'flipInX', | |
- | + | items:1, | |
- | + | margin:30, | |
- | + | stagePadding:30, | |
- | + | smartSpeed:450, | |
- | + | nav: true, | |
- | + | loop: true | |
- | + | }); | |
- | + | </script> | |
<!-- PJAX Content End --> | <!-- PJAX Content End --> | ||
</main> | </main> | ||
</html> | </html> |
Revision as of 00:01, 12 October 2014
{
"title" : "Homepage | USTC-China"
}
USTC China
Touch enabled jQuery plugin that lets you create beautiful responsive carousel slider.
Click for More