Team:ZJU-China/humanpractice.htm

From 2012.igem.org

(Difference between revisions)
Line 190: Line 190:
   display: none;
   display: none;
}
}
 +
 +
#banner {
 +
position: relative;
 +
left: 10%;
 +
width: 561px;
 +
height: 400px;
 +
border: 1px solid #666;
 +
overflow: hidden;
 +
}
 +
 +
#banner_list img {
 +
border: 0px;
 +
}
 +
 +
#banner_bg {
 +
position: absolute;
 +
bottom: 20px;
 +
background-color: #000;
 +
height: 44px;
 +
filter: Alpha(Opacity = 50);
 +
opacity: 0.5;
 +
z-index: 1000;
 +
cursor: pointer;
 +
width: 561px;
 +
}
 +
 +
#banner_info {
 +
position: absolute;
 +
bottom: 20px;
 +
left: 5px;
 +
height: 44px;
 +
color: #fff;
 +
z-index: 1001;
 +
cursor: pointer
 +
}
 +
 +
#banner_text {
 +
position: absolute;
 +
width: 120px;
 +
z-index: 1002;
 +
right: 3px;
 +
bottom: 3px;
 +
}
 +
 +
#banner ul {
 +
position: absolute;
 +
list-style-type: none;
 +
filter: Alpha(Opacity = 80);
 +
opacity: 0.8;
 +
border: 1px solid #fff;
 +
z-index: 1002;
 +
margin: 0;
 +
padding: 0;
 +
bottom: 3px;
 +
right: 5px;
 +
}
 +
 +
#banner ul li {
 +
padding: 0px 8px;
 +
float: left;
 +
display: block;
 +
color: #FFF;
 +
border: #e5eaff 1px solid;
 +
background: #6f4f67;
 +
cursor: pointer
 +
}
 +
</style>
</style>
Line 326: Line 393:
<p align="justify">&nbsp;</p>
<p align="justify">&nbsp;</p>
<p align="justify">Let’s take a look at what we tried this year! ZJU-China held a special event called "Scaffold in your eyes" in campus, and attracted a lot of attention. ZJU-China created a cute love story to illustrate our main idea of project, then we made an animation of this story, "a love story between Syn & Bio", in which we even create our own song. It is so interesting and so fun, definitely worth seeing! Additionally, ZJU-China thought ethical thinking is also crucial, and apart from the safety sheet we undergraduate researchers have to think about, we left the question directly to our freshmen in their first English Speech Contest.</p>
<p align="justify">Let’s take a look at what we tried this year! ZJU-China held a special event called "Scaffold in your eyes" in campus, and attracted a lot of attention. ZJU-China created a cute love story to illustrate our main idea of project, then we made an animation of this story, "a love story between Syn & Bio", in which we even create our own song. It is so interesting and so fun, definitely worth seeing! Additionally, ZJU-China thought ethical thinking is also crucial, and apart from the safety sheet we undergraduate researchers have to think about, we left the question directly to our freshmen in their first English Speech Contest.</p>
 +
<script type="text/javascript">
 +
var t = n = 0, count;
 +
$(document).ready(function(){
 +
counta=$("#banner_list a").length;
 +
$("#banner_list a:not(:first-child)").hide();
 +
$("#banner_info").html($("#banner_list a:first-child").find("img").attr('alt'));
 +
$("#banner_info").click(function(){window.open($("#banner_list a:first-child").attr('href'), "_blank")});
 +
$("#banner li").click(function() {
 +
var i = $(this).text() - 1;//1，2，3，4
 +
n = i;
 +
if (i >= counta) return;
 +
$("#banner_info").html($("#banner_list a").eq(i).find("img").attr('alt'));
 +
$("#banner_info").unbind().click(function(){window.open($("#banner_list a").eq(i).attr('href'), "_blank")})
 +
$("#banner_list a").filter(":visible").fadeOut(500).parent().children().eq(i).fadeIn(1000);
 +
document.getElementById("banner").style.background="";
 +
$(this).toggleClass("on");
 +
$(this).siblings().removeAttr("class");
 +
});
 +
 +
})
 +
 +
 +
</script>
 +
<div id="banner">
 +
<div id="banner_bg"></div>
 +
<div id="banner_info"></div>
 +
<ul>
 +
<li class="on">1</li>
 +
<li>2</li>
 +
<li>3</li>
 +
<li>4</li>
 +
<li>5</li>
 +
</ul>
 +
<div id="banner_list"><a href="#" target="_blank"><img
 +
src="https://static.igem.org/mediawiki/igem.org/a/ad/Zju_newigem1.JPG" width="600px"
 +
title="" alt="" /></a>
 +
<a href="#" target="_blank"><img
 +
src="https://static.igem.org/mediawiki/igem.org/c/ce/Zju_newigem2.JPG"
 +
title="" alt="" width="600px" /></a> <a href="#"
 +
target="_blank"><img
 +
src="https://static.igem.org/mediawiki/igem.org/f/fd/Zju_newigem3.JPG" width="600px"
 +
title="" alt="" /></a>
 +
<a href="#" target="_blank"><img
 +
src="https://static.igem.org/mediawiki/igem.org/a/a3/Zju_newigem4.JPG" width="600px"
 +
alt="" title="" /></a>
 +
<a href="#" target="_blank"><img
 +
src="https://static.igem.org/mediawiki/igem.org/a/a3/Zju_newigem5.JPG" width="600px"
 +
alt="" title="" /></a></div>
 +
</div>
<div><img src="https://static.igem.org/mediawiki/igem.org/a/ad/Zju_newigem1.JPG" width="500px"></div>
<div><img src="https://static.igem.org/mediawiki/igem.org/a/ad/Zju_newigem1.JPG" width="500px"></div>

Revision as of 15:01, 26 September 2012

HUMAN PRACTICE

01 AT A GLANCE

02 EXPERIENCE A REAL IGEM

03 EXPLORE A NEW IGEM

04 COLLARATIONS

05 FUTURE WORK





Retrieved from "http://2012.igem.org/Team:ZJU-China/humanpractice.htm"