Template:Peking2012 Color Project

From 2012.igem.org

(Difference between revisions)
m
m
 
(17 intermediate revisions not shown)
Line 9: Line 9:
</script>
</script>
<div class="floatL">
<div class="floatL">
-
  <ul id="PKU_subsubmenu" class="vertical">
+
  <ul id="PKU_subsubmenu" class="vertical" onmouseout="listReset();">
-
   <li class="trunk" style="background-image:url('/wiki/images/a/a4/Peking2012_Color_Title_FlameYellow.jpg');">
+
   <li class="trunk" style="background-image:url('/wiki/images/b/be/Peking2012_Color_Title_AquaBlue.jpg');" onmouseover="listTrigger(0);">
 +
  <a href="/Team:Peking/Project">Overview</a>
 +
  </li><li class="branch" onmouseover="listTrigger(0);">
 +
  <ul class="vertical">
 +
    <li>
 +
    <a href="/Team:Peking/Project">Motivation</a>
 +
    </li><li>
 +
    <a href="/Team:Peking/Project/Overview">Achievements</a>
 +
    </li>
 +
  </ul>
 +
  </li><li class="trunk" style="background-image:url('/wiki/images/a/a4/Peking2012_Color_Title_FlameYellow.jpg');" onmouseover="listTrigger(1);">
   <a href="/Team:Peking/Project/Luminesensor">Luminesensor</a>
   <a href="/Team:Peking/Project/Luminesensor">Luminesensor</a>
-
   </li><li class="branch">
+
   </li><li class="branch" onmouseover="listTrigger(1);">
   <ul class="vertical">
   <ul class="vertical">
     <li>
     <li>
Line 20: Line 30:
     </li><li>
     </li><li>
     <a href="/Team:Peking/Project/Luminesensor/Characterization">Characterization</a>
     <a href="/Team:Peking/Project/Luminesensor/Characterization">Characterization</a>
 +
    </li><li>
 +
    <a href="/Team:Peking/Project/Luminesensor/Future">Future Work</a>
     </li>
     </li>
   </ul>
   </ul>
-
   </li><li class="trunk" style="background-image:url('/wiki/images/a/a2/Peking2012_Color_Title_FreshGreen.jpg');">
+
   </li><li class="trunk" style="background-image:url('/wiki/images/a/a2/Peking2012_Color_Title_FreshGreen.jpg');" onmouseover="listTrigger(2);">
   <a href="/Team:Peking/Project/Communication">Light Communication</a>
   <a href="/Team:Peking/Project/Communication">Light Communication</a>
-
   </li><li class="trunk" style="background-image:url('/wiki/images/f/fe/Peking2012_Color_Title_GrapePurple.jpg');">
+
   </li><li class="branch" onmouseover="listTrigger(2);">
-
  <a href="/Team:Peking/Project/3D/2D">Synbio in 2D & 3D</a>
+
-
  </li><li class="branch">
+
   <ul class="vertical">
   <ul class="vertical">
     <li>
     <li>
 +
    <a href="/Team:Peking/Project/Communication">Introduction</a>
 +
    </li><li>
 +
    <a href="/Team:Peking/Project/Communication/Design">Design</a>
 +
    </li><li>
 +
    <a href="/Team:Peking/Project/Communication/Results">Results</a>
 +
    </li><li>
 +
    <a href="/Team:Peking/Project/Communication/Future">Perspective</a>
 +
    </li>
 +
  </ul>
 +
  </li><li class="trunk" style="background-image:url('/wiki/images/f/fe/Peking2012_Color_Title_GrapePurple.jpg');" onmouseover="listTrigger(3);">
 +
  <a href="/Team:Peking/Project/3D">Syn Bio in 2D & 3D</a>
 +
  </li><li class="branch" onmouseover="listTrigger(3);">
 +
  <ul class="vertical">
 +
    <li>
 +
    <a href="/Team:Peking/Project/3D">Introduction</a>
 +
    </li><li>
     <a href="/Team:Peking/Project/3D/2D">2D Printing</a>
     <a href="/Team:Peking/Project/3D/2D">2D Printing</a>
     </li><li>
     </li><li>
     <a href="/Team:Peking/Project/3D/3D">3D Printing</a>
     <a href="/Team:Peking/Project/3D/3D">3D Printing</a>
 +
    </li><li>
 +
    <a href="/Team:Peking/Project/3D/Future">Future Perspective</a>
     </li>
     </li>
   </ul>
   </ul>
-
   </li><li class="trunk" style="background-image:url('/wiki/images/5/50/Peking2012_Color_Title_CherryPink.jpg');">
+
   </li><li class="trunk" style="background-image:url('/wiki/images/5/50/Peking2012_Color_Title_CherryPink.jpg');" onmouseover="listTrigger(4);">
   <a href="/Team:Peking/Project/Phototaxis">Phototaxis</a>
   <a href="/Team:Peking/Project/Phototaxis">Phototaxis</a>
 +
  </li><li class="branch" onmouseover="listTrigger(4);">
 +
  <ul class="vertical">
 +
    <li>
 +
    <a href="/Team:Peking/Project/Phototaxis">Introduction</a>
 +
    </li><li>
 +
    <a href="/Team:Peking/Project/Phototaxis/Design">Design</a>
 +
    </li><li>
 +
    <a href="/Team:Peking/Project/Phototaxis/Demonstration">Demonstration</a>
 +
    </li>
 +
  </ul>
   </li>
   </li>
  </ul>
  </ul>
-
</div></html>
+
</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 = 5; //Total Number
 +
var sublists_Cur = -1; //Current Grow
 +
var sublists_Now = 0; //Current Page
 +
var subLhght = [60,120,120,120,90]; //Unit: Pixel
 +
var subLhght_Cur = [0,0,0,0,0]; //Unit: Pixel
 +
var subLhand_Wither = [null,null,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>

Latest revision as of 05:25, 26 October 2012

Retrieved from "http://2012.igem.org/Template:Peking2012_Color_Project"