Team:CAU China/Notebook

From 2014.igem.org

(Difference between revisions)
 
(8 intermediate revisions not shown)
Line 1: Line 1:
{{Notebook}}
{{Notebook}}
{{CAU_China/Menu}}
{{CAU_China/Menu}}
 +
{{CSS/Main}}
<html>
<html>
<style>
<style>
-
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/
+
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;}  
</style>
</style>
-
<!--  here ends the section that changes the default wiki template to a white full width background -->
 
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
-
<script type="text/javascript">
+
<script src="https://2014.igem.org/Team:CAU_China/jquery.notebook.js?action=raw&ctype=text/javascript"></script>
-
(function ($) {
+
<script src="https://2014.igem.org/Team:CAU_China/main.notebook.js?action=raw&ctype=text/javascript"></script>
-
  if (!!window.ActiveXObject && !window.XMLHttpRequest && (location.href=='http://www.orgsc.com' || location.href=='http://www.orgsc.com/')) return;
+
-
  $(function () {
+
-
    nav();
+
-
    bnrSilder();
+
-
    sideSlider();
+
-
    helpToggle();
+
-
    systole();
+
-
    slideImg();
+
-
    downM();
+
-
    ExtMutual();
+
-
    slides("#slides", ".slides");
+
-
    skinMutual();
+
-
    srollList("#dialog01", "11");
+
-
    srollList("#dialog02", "6");
+
-
    anchorLink();
+
-
 
+
-
    var img = document.createElement("img");
+
-
    img.onload = function() {
+
-
      window.onload = function () {
+
-
        skinShow();
+
-
      };
+
-
    };
+
-
  });
+
-
 
+
-
//滚动
+
-
  function nav() {
+
-
    var $liCur = $(".nav-box ul li.cur"),
+
-
      curP = $liCur.position().left,
+
-
      curW = $liCur.outerWidth(true),
+
-
      $slider = $(".nav-line"),
+
-
      $targetEle = $(".nav-box ul li:not('.last') a"),
+
-
      $navBox = $(".nav-box");
+
-
    $slider.stop(true, true).animate({
+
-
      "left":curP,
+
-
      "width":curW
+
-
    });
+
-
    $targetEle.mouseenter(function () {
+
-
      var $_parent = $(this).parent(),
+
-
        _width = $_parent.outerWidth(true),
+
-
        posL = $_parent.position().left;
+
-
      $slider.stop(true, true).animate({
+
-
        "left":posL,
+
-
        "width":_width
+
-
      }, "fast");
+
-
    });
+
-
    $navBox.mouseleave(function (cur, wid) {
+
-
      cur = curP;
+
-
      wid = curW;
+
-
      $slider.stop(true, true).animate({
+
-
        "left":cur,
+
-
        "width":wid
+
-
      }, "fast");
+
-
    });
+
-
  }
+
-
 
+
-
  ;
+
-
//滚动
+
-
  function bnrSilder() {
+
-
    if (!$("#head").length && !$("#bnr").length) {
+
-
      return;
+
-
    }
+
-
    (function () {
+
-
      if (navigator.userAgent.toLocaleLowerCase().indexOf('opera') >= 0) return;
+
-
      var sstag = document.createElement('script');
+
-
      sstag.type = 'text/javascript';
+
-
      sstag.async = true;
+
-
      sstag.src = 'script/SmoothScroll.js';
+
-
      var s = document.getElementsByTagName('script')[0];
+
-
      s.parentNode.insertBefore(sstag, s);
+
-
    })();
+
-
    $(window).scroll(function () {
+
-
      var bTop = $(this).scrollTop();
+
-
      $('.bnr-box').css({
+
-
        'margin-top':-bTop * 0.48
+
-
      });
+
-
      $('.bnr-txt').css({
+
-
        'margin-top':-bTop * 0.68
+
-
      });
+
-
      $('.bnr-btn').css({
+
-
        'margin-top':-bTop * 0.68
+
-
      });
+
-
      $('.warper').css({
+
-
        "background-position":"50% " + bTop * 0.2 + "px"
+
-
      });
+
-
      if (bTop < 200) {
+
-
        $(".txt-warp").css({
+
-
          'margin-top':-bTop * 1.5
+
-
        });
+
-
        $(".txt-nav-warp").removeAttr("style");
+
-
      } else {
+
-
        $(".txt-warp").css({
+
-
          'margin-top':-240
+
-
        });
+
-
        $(".txt-nav-warp").css({
+
-
          "position":"fixed",
+
-
          "top":0,
+
-
          "left":0,
+
-
          "box-shadow":"0 2px 6px #eee"
+
-
        });
+
-
 
+
-
      }
+
-
      var idxs = 0;
+
-
      if (bTop >= 200 && bTop < 577) {
+
-
        idxs;
+
-
      } else if (bTop >= 577 && bTop < 1072) {
+
-
        idxs = 1;
+
-
      } else if (bTop >= 1072 && bTop < 1165) {
+
-
        idxs = 2;
+
-
      } else if (bTop >= 1165) {
+
-
        idxs = 3;
+
-
      }
+
-
      $('.txt-nav li a').eq(idxs).addClass('on').parent().siblings().children().removeClass
+
-
 
+
-
        ('on');
+
-
      if (bTop < 200) {
+
-
        $('.txt-nav li a').removeClass('on');
+
-
      }
+
-
    });
+
-
  };
+
-
 
+
-
 
+
-
  function sideSlider() {
+
-
    if (!$(".help-side dl").length) {
+
-
      return false;
+
-
    }
+
-
    var $aCur = $(".help-side dl").find(".cur a"),
+
-
      $targetA = $(".help-side dl dd a"),
+
-
      $sideSilder = $(".side-slider"),
+
-
      curT = $aCur.position().top - 3;
+
-
    $sideSilder.stop(true, true).animate({
+
-
      "top":curT
+
-
    });
+
-
    $targetA.mouseenter(function () {
+
-
      var posT = $(this).position().top - 3;
+
-
      $sideSilder.stop(true, true).animate({
+
-
        "top":posT
+
-
      }, 240);
+
-
    }).parents(".help-side").mouseleave(function (_curT) {
+
-
        _curT = curT
+
-
        $sideSilder.stop(true, true).animate({
+
-
          "top":_curT
+
-
        });
+
-
      });
+
-
  }
+
-
 
+
-
  ;
+
-
 
+
-
  function helpToggle() {
+
-
    if (!$(".help-cont dl dt a").length) {
+
-
      return;
+
-
    }
+
-
    var $targetEle = $(".help-cont dl dt a");
+
-
    $targetEle.toggle(function () {
+
-
      $(this).parent().css({
+
-
        "background-position":"0 -20px"
+
-
      }).siblings().slideDown();
+
-
      return false;
+
-
    }, function () {
+
-
      $(this).parent().removeAttr("style").siblings().slideUp();
+
-
      return false;
+
-
    });
+
-
  }
+
-
 
+
-
  ;
+
-
 
+
-
  function systole() {
+
-
    if (!$(".history").length) {
+
-
      return;
+
-
    }
+
-
    var $warpEle = $(".history-date"),
+
-
      $targetA = $warpEle.find("h2 a,ul li dl dt a"),
+
-
      parentH,
+
-
      eleTop = [];
+
-
    parentH = $warpEle.parent().height();
+
-
    $warpEle.parent().css({
+
-
      "height":59
+
-
    });
+
-
    setTimeout(function () {
+
-
 
+
-
      $warpEle.find("ul").children(":not('h2:first')").each(function (idx) {
+
-
        eleTop.push($(this).position().top);
+
-
        $(this).css({
+
-
          "margin-top":-eleTop[idx]
+
-
        }).children().hide();
+
-
      }).animate({
+
-
          "margin-top":0
+
-
        }, 1600).children().fadeIn();
+
-
      $warpEle.parent().animate({
+
-
        "height":parentH
+
-
      }, 2600);
+
-
 
+
-
      $warpEle.find("ul").children(":not('h2:first')").addClass("bounceInDown").css({
+
-
        "-webkit-animation-duration":"2s",
+
-
        "-webkit-animation-delay":"0",
+
-
        "-webkit-animation-timing-function":"ease",
+
-
        "-webkit-animation-fill-mode":"both"
+
-
      }).end().children("h2").css({
+
-
          "position":"relative"
+
-
        });
+
-
    }, 600);
+
-
 
+
-
    $targetA.click(function () {
+
-
      $(this).parent().css({
+
-
        "position":"relative"
+
-
      });
+
-
      $(this).parent().siblings().slideToggle();
+
-
      $warpEle.parent().removeAttr("style");
+
-
      return false;
+
-
    });
+
-
 
+
-
  }
+
-
 
+
-
  ;
+
-
 
+
-
 
+
-
})(jQuery);
+
-
</script>
+
-
 
+
-
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
+
-
 
+
-
 
+
-
<!--main content -->
+
-
<table width="70%" align="center">
+
-
 
+
-
 
+
-
<tr>
+
-
 
+
-
 
+
-
 
+
-
 
+
-
</tr>
+
-
 
+
-
 
+
-
</tr>
+
-
+
-
 
+
-
 
+
-
 
+
-
 
+
-
</td>
+
-
 
+
-
<tr> <td colspan="3"  height="15px"> </td></tr>
+
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1px"> </tr>
+
-
<tr> <td colspan="3"  height="5px"> </td></tr>
+
-
 
+
-
 
+
-
</table>
+
Line 265: Line 18:
         <div class="nav-box">
         <div class="nav-box">
           <ul>
           <ul>
-
               <li class="cur" style="text-align:center; font-size:62px; font-family:'微软雅黑', '宋体';">Notebook</li>
+
               <li class="cur" style="text-align:center; font-size:40px; font-family:'微软雅黑', '宋体';">Breakthrough</li>
           </ul>
           </ul>
         </div>
         </div>
   </div>
   </div>
</div>
</div>
 +
 +
 +
<div class="main">
<div class="main">
   <div class="history">
   <div class="history">
 +
     <div class="history-date">
     <div class="history-date">
       <ul>
       <ul>
-
       <h2 class="first"><a href="#nogo">Augest</a></h2>
+
       <h2 class="first"><a href="#nogo">October</a></h2>
       <li class="green">
       <li class="green">
-
           <h3>.<span>Augest</span></h3>
+
           <h3>.<span>October</span></h3>
           <dl>
           <dl>
             <dt>######
             <dt>######
Line 284: Line 41:
         </li>       
         </li>       
         <li>
         <li>
-
           <h3>.<span>Augest</span></h3>
+
           <h3>.<span>October</span></h3>
           <dl>
           <dl>
             <dt>***************</span>
             <dt>***************</span>
Line 292: Line 49:
       </ul>
       </ul>
     </div>
     </div>
 +
 +
    <div class="history-date">
 +
      <ul>
 +
      <h2 class="date02"><a href="#nogo">September</a></h2>
 +
        <li class="green">
 +
          <h3>.<span>September</span></h3>
 +
          <dl>
 +
            <dt>##########
 +
<span>*************</span>
 +
</dt>
 +
          </dl>
 +
        </li>
 +
      <li>
 +
          <h3>.<span>September</span></h3>
 +
          <dl>
 +
            <dt>#######
 +
<span>***************</span>
 +
</dt>
 +
          </dl>
 +
        </li>
 +
      </ul>
 +
    </div>
 +
 +
    <div class="history-date">
 +
      <ul>
 +
      <h2 class="date02"><a href="#nogo">Augest</a></h2>
 +
        <li class="green">
 +
          <h3>.<span>Augest</span></h3>
 +
          <dl>
 +
            <dt>##########
 +
<span>*************</span>
 +
</dt>
 +
          </dl>
 +
        </li>
 +
      <li>
 +
          <h3>.<span>Augest</span></h3>
 +
          <dl>
 +
            <dt>#######
 +
<span>***************</span>
 +
</dt>
 +
          </dl>
 +
        </li>
 +
      </ul>
 +
    </div>
 +
     <div class="history-date">
     <div class="history-date">
       <ul>
       <ul>
Line 303: Line 105:
           </dl>
           </dl>
         </li>
         </li>
-
 
       <li>
       <li>
           <h3>.<span>July</span></h3>
           <h3>.<span>July</span></h3>
Line 314: Line 115:
       </ul>
       </ul>
     </div>
     </div>
 +
     <div class="history-date">
     <div class="history-date">
       <ul>
       <ul>

Latest revision as of 03:51, 18 October 2014

  • Breakthrough

    October

  • .October

    ###### *************

  • .October

    ***************

    September

  • .September

    ########## *************

  • .September

    ####### ***************

    Augest

  • .Augest

    ########## *************

  • .Augest

    ####### ***************

    July

  • .July

    ########## *************

  • .July

    ####### ***************

    June

  • .June

    ############# ******************




Retrieved from "http://2014.igem.org/Team:CAU_China/Notebook"