Team:Nanjing NFLS/test
From 2014hs.igem.org
(Difference between revisions)
AlexGorilla (Talk | contribs) |
AlexGorilla (Talk | contribs) |
||
(39 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
- | {{ | + | {{Template:NFLSIndex}} |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | } | + | |
- | + | <html> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | <!--picture banner--> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
<style type="text/css"> | <style type="text/css"> | ||
- | + | background {color:black} | |
- | . | + | img { border: 0px; } |
- | -- | + | #banner { margin: 200px auto 100px 20px;padding: 0px; width: 1150px; height: 400px; float:left;} |
- | </style></ | + | .slides { margin: 0px auto; width: 100%; height: 360px; overflow: hidden; position: relative; } |
+ | .slide-pic { margin: 0px; padding: 0px; width: 100%; overflow: hidden; list-style: none; } | ||
+ | .slide-pic img { width: 100%; height: 360px; } | ||
+ | .slide-pic li { display: none; } | ||
+ | .slide-pic li.cur { display: block; } | ||
+ | .slide-li {padding: 0px; right: 50px; bottom: 15px; position: absolute;float:left;} | ||
+ | .slide-li li { margin: 0px; padding: 0px; width: 30px; height:40px ;float:left;overflow:hidden;} | ||
+ | .slide-li a { width: 30px; height: 20px; color: #000; font-size: 26px; display: block; text-align:center;text-decoration:none;margin-bottom:5px;} | ||
+ | .slide-li a:hover { color: #ccc; text-decoration: none; } | ||
+ | .slide-txt span { display: none; } | ||
+ | </style> | ||
+ | <script type="text/javascript"> | ||
+ | jQuery(function ($) { | ||
+ | if ($(".slide-pic").length > 0) { | ||
+ | var defaultOpts = { interval: 5000, fadeInTime: 300, fadeOutTime: 200 }; | ||
+ | var _titles = $("ul.slide-txt li"); | ||
+ | var _titles_bg = $("ul.op li"); | ||
+ | var _bodies = $("ul.slide-pic li"); | ||
+ | var _count = _titles.length; | ||
+ | var _current = 0; | ||
+ | var _intervalID = null; | ||
+ | var stop = function () { window.clearInterval(_intervalID); }; | ||
+ | var slide = function (opts) { | ||
+ | if (opts) { | ||
+ | _current = opts.current || 0; | ||
+ | } else { | ||
+ | _current = (_current >= (_count - 1)) ? 0 : (++_current); | ||
+ | }; | ||
+ | _bodies.filter(":visible").fadeOut(defaultOpts.fadeOutTime, function () { | ||
+ | _bodies.eq(_current).fadeIn(defaultOpts.fadeInTime); | ||
+ | _bodies.removeClass("cur").eq(_current).addClass("cur"); | ||
+ | }); | ||
+ | _titles.removeClass("cur").eq(_current).addClass("cur"); | ||
+ | _titles_bg.removeClass("cur").eq(_current).addClass("cur"); | ||
+ | }; | ||
+ | var go = function () { | ||
+ | stop(); | ||
+ | _intervalID = window.setInterval(function () { slide(); }, defaultOpts.interval); | ||
+ | }; | ||
+ | var itemMouseOver = function (target, items) { | ||
+ | stop(); | ||
+ | var i = $.inArray(target, items); | ||
+ | slide({ current: i }); | ||
+ | }; | ||
+ | _titles.hover(function () { if ($(this).attr('class') != 'cur') { itemMouseOver(this, _titles); } else { stop(); } }, go); | ||
+ | _bodies.hover(stop, go); | ||
+ | go(); | ||
+ | } | ||
+ | }); | ||
+ | </script> | ||
- | < | + | <!-- START --> |
- | < | + | <div id="banner"> |
- | </ | + | <div class="slides"> |
+ | <ul class="slide-pic"> | ||
+ | <li class="cur"> | ||
+ | <img alt="" src="https://static.igem.org/mediawiki/2014hs/e/e0/NFLST1.jpg" /></li> | ||
+ | <li> | ||
+ | <img alt="" src="https://static.igem.org/mediawiki/2014hs/c/c0/NFLSLogo.jpg" /></li> | ||
+ | <li> | ||
+ | <img alt="" src="https://static.igem.org/mediawiki/2014hs/5/54/NFLST3.jpg" /></li> | ||
+ | <li> | ||
+ | <img alt="" src="https://static.igem.org/mediawiki/2014hs/f/f8/NFLST4.jpg" /></li> | ||
+ | <li> | ||
+ | <img alt="" src="https://static.igem.org/mediawiki/2013/e/e2/NFLST5.jpg" /></li> | ||
+ | |||
+ | </ul> | ||
+ | <ul class="slide-li op"> | ||
+ | <li class="cur"></li> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | <li></li> | ||
+ | </ul> | ||
+ | <ul class="slide-li slide-txt"> | ||
+ | <li><a href="#">●</a></li> | ||
+ | <li><a href="#">●</a></li> | ||
+ | <li><a href="#">●</a></li> | ||
+ | <li><a href="#">●</a></li> | ||
+ | <li><a href="#">●</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | <!-- END OF THE BANNER --> | ||
+ | <div id="primary-nav"> | ||
+ | <ul> | ||
+ | <li class="selected" id="nav-main" ><a href="project.html">MAIN</a></li> | ||
+ | <li id="nav-project"><a href="project.html">PROJECT</a></li> | ||
+ | <li id="nav-biobricks"><a href="biobricks.html">BIOBRICKS</a></li> | ||
+ | <li id="nav-notebook"><a href="notebook.html">NOTEBOOK</a></li> | ||
+ | <li id="nav-safety"><a href="safety.html">SAFETY</a></li> | ||
+ | <li id="nav-humanpractice"><a href="humanpractice.html">HUMAN PRACTICE</a></li> | ||
+ | <li id="nav-team"><a href="https://2014hs.igem.org/Team:Nanjing_NFLS/team">TEAM</a></li> | ||
+ | <li id="av-ourpartners"><a href="https://2014hs.igem.org/Team:Nanjing_NFLS/ourpartners.html">OUR PARTNERS</a></li> | ||
+ | <li id="nav-contactus"><a href="mailto:shushutaishuaile@outlook.com">CONTACT US</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
</html> | </html> |
Latest revision as of 06:30, 19 June 2014