Template:Peking2012 Color HumanPractice

<html>
<!--
 --- Peking 2012 Header
 --- by Sun Sibai
 --- this = /Template:Peking2012_Color_HumanPractice
 -->
<style type="text/css">
#text-body ul#PKU_subsubmenu > li
{
  width: 224px;
}
#text-body .PKU_context.floatR p
{
  width: 600px;
}
#text-body .PKU_context.floatR p.description
{
  width: 500px;
}
</style>
<script type="text/javascript">
document.getElementById("PKU_banner_menu").getElementsByTagName("a")[5].style.color="#60b0f0";
</script>
<div class="floatL">
 <ul id="PKU_subsubmenu" class="vertical" onmouseout="listReset();">
  <li class="trunk" style="background-image:url('/wiki/images/f/fe/Peking2012_Color_Title_GrapePurple.jpg');" onmouseover="listTrigger(0);">
   <a href="/Team:Peking/HumanPractice/Sowing">Sowing Tomorrow Synthetic biologists</a>
  </li><li class="branch" onmouseover="listTrigger(0);">
   <ul class="vertical">
    <li>
     <a href="/Team:Peking/HumanPractice/Sowing">Overview</a>
    </li><li>
     <a href="/Team:Peking/HumanPractice/Sowing/Pre">Pre-investigation</a>
    </li><li>
     <a href="/Team:Peking/HumanPractice/Sowing/Forming">Forming Alliance</a>
    </li><li>
     <a href="/Team:Peking/HumanPractice/Sowing/Lecture">Lecture</a>
    </li><li>
     <a href="/Team:Peking/HumanPractice/Sowing/Guidance">Guidance & Funding Application</a>
    </li>
   </ul>
  </li><li class="trunk" style="background-image:url('/wiki/images/a/a2/Peking2012_Color_Title_FreshGreen.jpg');" onmouseover="listTrigger(1);">
   <a href="/Team:Peking/HumanPractice/Review">Historic iGEM Projects Review</a>
  </li><li class="branch" onmouseover="listTrigger(1);">
   <ul class="vertical">
    <li>
     <a href="/Team:Peking/HumanPractice/Review">Historic iGEM Projects Review</a>
    </li>
   </ul>
  </li><li class="trunk" style="background-image:url('/wiki/images/a/a4/Peking2012_Color_Title_FlameYellow.jpg');" onmouseover="listTrigger(2);">
   <a href="/Team:Peking/HumanPractice/Outreach/Visiting">Outreach & Workshop</a>
  </li><li class="branch" onmouseover="listTrigger(2);">
   <ul class="vertical">
    <li>
     <a href="/Team:Peking/HumanPractice/Outreach/Visiting">Visiting</a>
    </li><li>
     <a href="/Team:Peking/HumanPractice/Outreach/Workshop">Workshop</a>
    </li><li>
     <a href="/Team:Peking/HumanPractice/Outreach/Collaboration">Collaboration</a>
    </li>
   </ul>
  </li>
 </ul>
</div>
<script type="text/javascript">
/*
 * Peking 2012 Following
 * by Sun Sibai
 */
var subfirst = document.getElementById("PKU_subsubmenu");
var sub1hght = 0;
function Following()
{
  sub1hght=sub1hght*0.9+(document.documentElement.scrollTop+document.body.scrollTop)*0.1-10;
  if (sub1hght<0) {sub1hght=0;}
  subfirst.style.marginTop = sub1hght + 'px';
}
var handleFollowing = setInterval(Following,30);
</script><script type="text/javascript">
/*
 * Peking 2012 Drawer
 * by Sun Sibai
 */
var sublists_Num = 3; //Total Number
var sublists_Cur = -1; //Current Grow
var sublists_Now = 0; //Current Page
var subLhght = [150,30,90]; //Unit: Pixel
var subLhght_Cur = [0,0,0]; //Unit: Pixel
var subLhand_Wither = [null,null,null];
var subLhand_Growth = null;
var subLhand_Return = null;
var sublists = subfirst.childNodes;
for (var it=0;it<sublists_Num;++it)
{
  sublists[2*it+2].style.height=subLhght_Cur[it]+'px';
  sublists[2*it+2].style.display='none';
}
/* Automatic Function */
function listGrowth()
{
  subLhght_Cur[sublists_Cur] = subLhght_Cur[sublists_Cur] * 0.7 + subLhght[sublists_Cur] * 1.2 * 0.3;
  if (subLhght_Cur[sublists_Cur]>=subLhght[sublists_Cur])
  {
    subLhght_Cur[sublists_Cur]=subLhght[sublists_Cur];
    subLhand_Growth = null;
  }
  else
  {
    subLhand_Growth = setTimeout(listGrowth,50);
  }
  sublists[2*sublists_Cur+2].style.height=subLhght_Cur[sublists_Cur]+'px';
}
function listWitherFunc(i)
{
  return function() {listWither(i);};
}
function listWither(i)
{
  subLhght_Cur[i] = subLhght_Cur[i] * 0.7 - 0.5;
  if (subLhght_Cur[i]<=0)
  {
    subLhght_Cur[i] = 0;
    subLhand_Wither[i] = null;
    sublists[2*i+2].style.display='none';
  }
  else
  {
    subLhand_Wither[i] = setTimeout(listWitherFunc(i),50);
  }
  sublists[2*i+2].style.height=subLhght_Cur[i]+'px';
}
function listReturn()
{
  listTrigger(sublists_Now);
  subLhand_Return = null;
}
/* Trigger Function */
function listTrigger(i)
{
  if (subLhand_Return) {clearTimeout(subLhand_Return);subLhand_Return=null;}
  if (i!=sublists_Cur)
  {
    if (subLhand_Growth) {clearTimeout(subLhand_Growth);}
    if (sublists_Cur>=0) {if (!subLhand_Wither[sublists_Cur]) {listWither(sublists_Cur);}}
    if (subLhand_Wither[i]) {clearTimeout(subLhand_Wither[i]);subLhand_Wither[i]=null;}
    sublists[2*i+2].style.display='block';
    sublists_Cur = i;
    listGrowth();
  }
}
function listReset()
{
  if (subLhand_Return) {clearTimeout(listReturn);}
  subLhand_Return = setTimeout(listReturn,1000);
}
</script>
</html>