View source for Team:TCU Taiwan/Human Practice

{{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&amp;ctype=text/css" />
<!--引入结束-->

<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></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="#/"><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&amp;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></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>
</body>
</head>	
</html>
{{TCU_Taiwan/CSSfooter}}