Team:Nanjing NFLS/test

From 2014hs.igem.org

(Difference between revisions)
(Created page with "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta...")
 
(40 intermediate revisions not shown)
Line 1: Line 1:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
{{Template:NFLSIndex}}
-
<html xmlns="http://www.w3.org/1999/xhtml">
+
-
<head>
+
-
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
-
<title>无标题文档</title>
+
-
<script type="text/javascript">
+
-
<!--
+
-
function MM_swapImgRestore() { //v3.0
+
-
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
+
-
}
+
-
function MM_preloadImages() { //v3.0
+
-
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
+
-
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
+
-
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
+
-
}
+
-
function MM_findObj(n, d) { //v4.01
+
<html>
-
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
+
-
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
+
-
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
+
-
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
+
-
  if(!x && d.getElementById) x=d.getElementById(n); return x;
+
-
}
+
-
function MM_swapImage() { //v3.0
+
<!--picture banner-->
-
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
+
-
  if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
+
-
}
+
-
//-->
+
-
</script>
+
<style type="text/css">
<style type="text/css">
-
<!--
+
background {color:black}
-
.STYLE2 {font-size: 24px}
+
img { border: 0px; }
-
-->
+
#banner { margin: 200px auto 100px 20px;padding: 0px; width: 1150px; height: 400px; float:left;}
-
</style></head>
+
.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>
-
<body onload="MM_preloadImages('https://static.igem.org/mediawiki/2014hs/7/74/NFLST2.jpg')">
+
    <!-- START -->
-
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','https://static.igem.org/mediawiki/2014hs/7/74/NFLST2.jpg',1)"><img src="https://static.igem.org/mediawiki/2014hs/e/e0/NFLST1.jpg" name="Image1" width="382" height="426" border="0" id="Image1" /></a>Do some Test........Is this the special effect we want?
+
    <div id="banner">
-
</body>
+
        <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

iGEM Nanjing_NFLS