|
|
| (72 intermediate revisions by 2 users not shown) |
| Line 1: |
Line 1: |
| − | {{TCU_Taiwan/CSS}}
| |
| − | <html>
| |
| − | <head>
| |
| − | <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
| |
| − | <!--引入开始-->
| |
| − | <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Team:TCU_Taiwan/Human_Practice/CSS?action=raw&ctype=text/css" />
| |
| − | <!--引入结束-->
| |
| − | </head>
| |
| | | | |
| − | <style type="text/css">
| |
| − | body{
| |
| − | background-image:url(https://static.igem.org/mediawiki/2015/1/11/Tcu_taiwan2015_Igem_background.jpg);
| |
| − | background-repeat:no-repeat;
| |
| − | background-attachment:fixed;
| |
| − | background-size: 100% 100%;
| |
| − | margin:0; padding:0;
| |
| − | }
| |
| − |
| |
| − | </style>
| |
| − | <body oncontextmenu='return false' ondragstart='return false'>
| |
| − | </br></br></br></br></br>
| |
| − | <!-- 代码开始 -->
| |
| − | <div class="focus">
| |
| − | <div class="focusbox">
| |
| − | <div class="focusimg">
| |
| − | <ul class="fimglist clearfix">
| |
| − | <li><a href="#"><img src="" title="TZU CHI High School"></a></li>
| |
| − | <li><a href="#"><img src="" title="two"></a></li>
| |
| − | <li><a href="#"><img src="" title="three"></a></li>
| |
| − | <li><a href="#"><img src="" title="four"></a></li>
| |
| − | <li><a href="#"><img src="" title="iGEM Asian Conference"></a></li>
| |
| − | <li><a href="#"><img src="" title="Mingder High School"></a></li>
| |
| − | <li><a href="#"><img src="https://static.igem.org/mediawiki/2015/d/d8/2015tcutaiwanhumanpracticeonedaycamp.jpg" title="One day camp"></a></li>
| |
| − | </ul>
| |
| − | </div>
| |
| − | <div class="focustool">
| |
| − | <ul class="ftoollist clearfix"><!--通过控制该ul的left值来实现列表的左右移动，增量为931px-->
| |
| − | <li class="on"><a href="http://www.5imoban.net/"><img src="images/Gintama_s.jpg"><p class="imgname">TZU CHI High School</p><p class="imgshortcat">Date</p></a></li><!--当前项时为该li添加class: on-->
| |
| − | <li><a href="#"><img src="images/SteinsGate_s.jpg"><p class="imgname">two</p><p class="imgshortcat">Date</p></a></li>
| |
| − | <li><a href="#"><img src="images/Unicorn_s.jpg"><p class="imgname">three</p><p class="imgshortcat">Date</p></a></li>
| |
| − | <li><a href="#"><img src="images/Berserk_s.jpg"><p class="imgname">four</p><p class="imgshortcat">Date</p></a></li>
| |
| − | <li><a href="#"><img src="https://static.igem.org/mediawiki/2015/6/62/2015tcutaiwanhumanpracticeiGEM_Asian_Conference.jpg"><p class="imgname">iGEM Asian Conference</p><p class="imgshortcat">7/19-7/23</p></a></li>
| |
| − | <li><a href="#"><img src="images/akito_s.jpg"><p class="imgname">Mingder High School</p><p class="imgshortcat">6/2</p></a></li>
| |
| − | <li><a href="#"><img src=""><p class="imgname">One day camp</p><p class="imgshortcat">5/1</p></a></li>
| |
| − | </ul>
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| − | <script type="text/javascript" src="https://2015.igem.org/Template:TCU_Taiwan/mainpage_jquery/Javascript?action=raw&ctype=text/javascript"></script>
| |
| − | <script type="text/javascript">
| |
| − | jQuery.noConflict();
| |
| − | jQuery(document).ready(function($){
| |
| − | $(".guidelist li").hover(
| |
| − | function () {
| |
| − | $(this).attr("class", "mouseon");
| |
| − | },
| |
| − | function () {
| |
| − | $(this).attr("class", "mouseout");
| |
| − | }
| |
| − | );
| |
| − | $(".ftoollist li").mouseover(function(){
| |
| − | $(this).siblings().removeClass("on");
| |
| − | $(this).addClass("on");
| |
| − | var preNumber=$(this).prevAll().size();
| |
| − | $(".fimglist li").removeClass("onpre");
| |
| − | $(".fimglist li:nth-child("+preNumber+")").addClass("onpre");
| |
| − | var margin = 990;
| |
| − | margin = margin *preNumber;
| |
| − | margin = margin * -1;
| |
| − | $(".fimglist").stop().animate({marginLeft: margin + "px"}, {duration: 500});
| |
| − | });
| |
| − | });
| |
| − | </script>
| |
| − | </br></br></br></br></br></br></br></br></br></br></br></br></br>
| |
| − | </body>
| |
| − | </html>
| |
| − | {{TCU_Taiwan/CSSfooter}}
| |