Team:UCSF/Search

From 2010.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<html>
+
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
Line 13: Line 13:
}
}
#Long {
#Long {
-
position:relative;
+
position:absolute;
left:276px;
left:276px;
top:0px;
top:0px;
Line 21: Line 21:
}
}
#apDiv1 {
#apDiv1 {
-
position:relative;
+
position:absolute;
left:285px;
left:285px;
top:15px;
top:15px;
Line 29: Line 29:
}
}
#apDiv2 {
#apDiv2 {
-
position:relative;
+
position:absolute;
width:80px;
width:80px;
height:115px;
height:115px;
Line 42: Line 42:
<p>&nbsp;</p>
<p>&nbsp;</p>
<div id="SideBar"><img src="https://static.igem.org/mediawiki/2008/0/0e/UCSF2008logo2.jpg" width="276" height="288" longdesc="https://static.igem.org/mediawiki/2008/0/0e/UCSF2008logo2.jpg" /></div>
<div id="SideBar"><img src="https://static.igem.org/mediawiki/2008/0/0e/UCSF2008logo2.jpg" width="276" height="288" longdesc="https://static.igem.org/mediawiki/2008/0/0e/UCSF2008logo2.jpg" /></div>
 +
<div id="Long">
 +
  <div id="apDiv2">
 +
    <p>Min Lin</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>Min Lin</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>MIN</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>MIN</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
    <p>&nbsp;</p>
 +
  </div>
 +
</div>
<script type="text/javascript"><!--
<script type="text/javascript"><!--
/* Script by: www.jtricks.com
/* Script by: www.jtricks.com
-
  * Version: 20071017
+
  * Version: 20071127
  * Latest version:
  * Latest version:
-
  * www.jtricks.com/javascript/navigation/floating.html
+
  * www.jtricks.com/javascript/navigation/fixed_menu.html
  */
  */
-
var floatingMenuId = 'SideBar';
+
fixedMenuId = 'SideBar';
-
var floatingMenu =
+
-
{
+
-
    targetX: -250,
+
-
    targetY: 10,
+
 +
var fixedMenu =
 +
{
     hasInner: typeof(window.innerWidth) == 'number',
     hasInner: typeof(window.innerWidth) == 'number',
-
     hasElement: typeof(document.documentElement) == 'object'
+
     hasElement: document.documentElement != null
-
        && typeof(document.documentElement.clientWidth) == 'number',
+
      && document.documentElement.clientWidth,
-
     menu:
+
     menu: document.getElementById
-
        document.getElementById
+
         ? document.getElementById(fixedMenuId)
-
         ? document.getElementById(floatingMenuId)
+
         : document.all
         : document.all
-
           ? document.all[floatingMenuId]
+
           ? document.all[fixedMenuId]
-
           : document.layers[floatingMenuId]
+
           : document.layers[fixedMenuId]
};
};
-
floatingMenu.move = function ()
+
fixedMenu.computeShifts = function()
{
{
-
     floatingMenu.menu.style.left = floatingMenu.nextX + 'px';
+
     fixedMenu.shiftX = fixedMenu.hasInner
-
    floatingMenu.menu.style.top = floatingMenu.nextY + 'px';
+
         ? pageXOffset
-
}
+
         : fixedMenu.hasElement
-
 
+
           ? document.documentElement.scrollLeft
-
floatingMenu.computeShifts = function ()
+
           : document.body.scrollLeft;
-
{
+
     if (fixedMenu.targetLeft > 0)
-
    var de = document.documentElement;
+
        fixedMenu.shiftX += fixedMenu.targetLeft;
-
 
+
    else
-
    floatingMenu.shiftX =
+
-
        floatingMenu.hasInner
+
-
         ? pageXOffset
+
-
         : floatingMenu.hasElement
+
-
           ? de.scrollLeft
+
-
           : document.body.scrollLeft;
+
-
     if (floatingMenu.targetX < 0)
+
     {
     {
-
         floatingMenu.shiftX +=
+
         fixedMenu.shiftX +=  
-
             floatingMenu.hasElement
+
             (fixedMenu.hasElement
-
            ? de.clientWidth
+
              ? document.documentElement.clientWidth
-
            : document.body.clientWidth;
+
              : fixedMenu.hasInner
 +
                ? window.innerWidth - 20
 +
                : document.body.clientWidth)
 +
            - fixedMenu.targetRight
 +
            - fixedMenu.menu.offsetWidth;
     }
     }
-
     floatingMenu.shiftY =  
+
     fixedMenu.shiftY = fixedMenu.hasInner
-
        floatingMenu.hasInner
+
         ? pageYOffset
         ? pageYOffset
-
         : floatingMenu.hasElement
+
         : fixedMenu.hasElement
-
           ? de.scrollTop
+
           ? document.documentElement.scrollTop
           : document.body.scrollTop;
           : document.body.scrollTop;
-
     if (floatingMenu.targetY < 0)
+
     if (fixedMenu.targetTop > 0)
 +
        fixedMenu.shiftY += fixedMenu.targetTop;
 +
    else
     {
     {
-
         if (floatingMenu.hasElement && floatingMenu.hasInner)
+
         fixedMenu.shiftY +=
 +
            (fixedMenu.hasElement
 +
            ? document.documentElement.clientHeight
 +
            : fixedMenu.hasInner
 +
              ? window.innerHeight - 20
 +
              : document.body.clientHeight)
 +
            - fixedMenu.targetBottom
 +
            - fixedMenu.menu.offsetHeight;
 +
    }
 +
};
 +
 
 +
fixedMenu.moveMenu = function()
 +
{
 +
    fixedMenu.computeShifts();
 +
 
 +
    if (fixedMenu.currentX != fixedMenu.shiftX
 +
        || fixedMenu.currentY != fixedMenu.shiftY)
 +
    {
 +
        fixedMenu.currentX = fixedMenu.shiftX;
 +
        fixedMenu.currentY = fixedMenu.shiftY;
 +
 
 +
        if (document.layers)
         {
         {
-
             // Handle Opera 8 problems
+
             fixedMenu.menu.left = fixedMenu.currentX;
-
            floatingMenu.shiftY +=
+
            fixedMenu.menu.top = fixedMenu.currentY;
-
                de.clientHeight > window.innerHeight
+
-
                ? window.innerHeight
+
-
                : de.clientHeight
+
         }
         }
         else
         else
         {
         {
-
             floatingMenu.shiftY +=
+
             fixedMenu.menu.style.left = fixedMenu.currentX + 'px';
-
                floatingMenu.hasElement
+
            fixedMenu.menu.style.top = fixedMenu.currentY + 'px';
-
                ? de.clientHeight
+
-
                : document.body.clientHeight;
+
         }
         }
     }
     }
-
}
 
-
floatingMenu.calculateCornerX = function()
+
     fixedMenu.menu.style.right = '';
-
{
+
     fixedMenu.menu.style.bottom = '';
-
     if (floatingMenu.targetX != 'center')
+
-
        return floatingMenu.shiftX + floatingMenu.targetX;
+
-
 
+
-
     var width = parseInt(floatingMenu.menu.offsetWidth);
+
-
 
+
-
    var cornerX =
+
-
        floatingMenu.hasElement
+
-
        ? (floatingMenu.hasInner
+
-
          ? pageXOffset
+
-
          : document.documentElement.scrollLeft) +
+
-
          (document.documentElement.clientWidth - width)/2
+
-
        : document.body.scrollLeft +
+
-
          (document.body.clientWidth - width)/2;
+
-
    return cornerX;
+
};
};
-
floatingMenu.calculateCornerY = function()
+
fixedMenu.floatMenu = function()
{
{
-
     if (floatingMenu.targetY != 'center')
+
     fixedMenu.moveMenu();
-
        return floatingMenu.shiftY + floatingMenu.targetY;
+
     setTimeout('fixedMenu.floatMenu()', 20);
-
 
+
-
    var height = parseInt(floatingMenu.menu.offsetHeight);
+
-
 
+
-
    // Handle Opera 8 problems
+
-
    var clientHeight =
+
-
        floatingMenu.hasElement && floatingMenu.hasInner
+
-
        && document.documentElement.clientHeight
+
-
            > window.innerHeight
+
-
        ? window.innerHeight
+
-
        : document.documentElement.clientHeight
+
-
 
+
-
    var cornerY =
+
-
        floatingMenu.hasElement
+
-
        ? (floatingMenu.hasInner 
+
-
          ? pageYOffset
+
-
          : document.documentElement.scrollTop) +
+
-
          (clientHeight - height)/2
+
-
        : document.body.scrollTop +
+
-
          (document.body.clientHeight - height)/2;
+
-
    return cornerY;
+
-
};
+
-
 
+
-
floatingMenu.doFloat = function()
+
-
{
+
-
    // Check if reference to menu was lost due
+
-
    // to ajax manipuations
+
-
    if (!floatingMenu.menu)
+
-
    {
+
-
        menu = document.getElementById
+
-
            ? document.getElementById(floatingMenuId)
+
-
            : document.all
+
-
              ? document.all[floatingMenuId]
+
-
              : document.layers[floatingMenuId];
+
-
 
+
-
        initSecondary();
+
-
    }
+
-
 
+
-
    var stepX, stepY;
+
-
 
+
-
    floatingMenu.computeShifts();
+
-
 
+
-
    var cornerX = floatingMenu.calculateCornerX();
+
-
 
+
-
    var stepX = (cornerX - floatingMenu.nextX) * .07;
+
-
    if (Math.abs(stepX) < .5)
+
-
    {
+
-
        stepX = cornerX - floatingMenu.nextX;
+
-
    }
+
-
 
+
-
    var cornerY = floatingMenu.calculateCornerY();
+
-
 
+
-
    var stepY = (cornerY - floatingMenu.nextY) * .07;
+
-
    if (Math.abs(stepY) < .5)
+
-
    {
+
-
        stepY = cornerY - floatingMenu.nextY;
+
-
    }
+
-
 
+
-
    if (Math.abs(stepX) > 0 ||
+
-
        Math.abs(stepY) > 0)
+
-
    {
+
-
        floatingMenu.nextX += stepX;
+
-
        floatingMenu.nextY += stepY;
+
-
        floatingMenu.move();
+
-
    }
+
-
 
+
-
     setTimeout('floatingMenu.doFloat()', 20);
+
};
};
// addEvent designed by Aaron Moore
// addEvent designed by Aaron Moore
-
floatingMenu.addEvent = function(element, listener, handler)
+
fixedMenu.addEvent = function(element, listener, handler)
{
{
     if(typeof element[listener] != 'function' ||  
     if(typeof element[listener] != 'function' ||  
Line 222: Line 189:
             var r = true;
             var r = true;
             e = (e) ? e : window.event;
             e = (e) ? e : window.event;
-
             for(var i = element[listener + '_num'] -1; i >= 0; i--)
+
             for(var i = 0; i < element[listener + '_num']; i++)
-
            {
+
                 if(element[listener + i](e) === false)
-
                 if(element[listener + i](e) == false)
+
                     r = false;
                     r = false;
-
            }
 
             return r;
             return r;
         }
         }
Line 239: Line 204:
};
};
-
floatingMenu.init = function()
+
fixedMenu.supportsFixed = function()
{
{
-
     floatingMenu.initSecondary();
+
     var testDiv = document.createElement("div");
-
     floatingMenu.doFloat();
+
     testDiv.id = "testingPositionFixed";
 +
    testDiv.style.position = "fixed";
 +
    testDiv.style.top = "0px";
 +
    testDiv.style.right = "0px";
 +
    document.body.appendChild(testDiv);
 +
    var offset = 1;
 +
    if (typeof testDiv.offsetTop == "number"
 +
        && testDiv.offsetTop != null
 +
        && testDiv.offsetTop != "undefined")
 +
    {
 +
        offset = parseInt(testDiv.offsetTop);
 +
    }
 +
    if (offset == 0)
 +
    {
 +
        return true;
 +
    }
 +
 
 +
    return false;
};
};
-
// Some browsers init scrollbars only after
+
fixedMenu.init = function()
-
// full document load.
+
-
floatingMenu.initSecondary = function()
+
{
{
-
     floatingMenu.computeShifts();
+
     if (fixedMenu.supportsFixed())
-
    floatingMenu.nextX = floatingMenu.calculateCornerX();
+
        fixedMenu.menu.style.position = "fixed";
-
     floatingMenu.nextY = floatingMenu.calculateCornerY();
+
     else
-
    floatingMenu.move();
+
    {
-
}
+
        var ob =  
 +
            document.layers
 +
            ? fixedMenu.menu
 +
            : fixedMenu.menu.style;
-
if (document.layers)
+
        fixedMenu.targetLeft = parseInt(ob.left);
-
    floatingMenu.addEvent(window, 'onload', floatingMenu.init);
+
        fixedMenu.targetTop = parseInt(ob.top);
-
else
+
        fixedMenu.targetRight = parseInt(ob.right);
-
{
+
        fixedMenu.targetBottom = parseInt(ob.bottom);
-
    floatingMenu.init();
+
-
    floatingMenu.addEvent(window, 'onload',
+
-
        floatingMenu.initSecondary);
+
-
}
+
-
//--></script>
+
-
<div id="Long">
+
        if (document.layers)
-
  <div id="apDiv2">
+
        {
-
    <p>Min Lin</p>
+
            menu.left = 0;
-
    <p>&nbsp;</p>
+
            menu.top = 0;
-
    <p>&nbsp;</p>
+
        }
-
    <p>&nbsp;</p>
+
        fixedMenu.addEvent(window, 'onscroll', fixedMenu.moveMenu);
-
    <p>&nbsp;</p>
+
        fixedMenu.floatMenu();
-
    <p>&nbsp;</p>
+
     }
-
     <p>&nbsp;</p>
+
};
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>Min Lin</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>MIN</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>MIN</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>MIN</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
    <p>&nbsp;</p>
+
-
  </div>
+
-
</div>
+
 +
fixedMenu.addEvent(window, 'onload', fixedMenu.init);
 +
 +
//--></script>
</body>
</body>
</html>
</html>

Revision as of 04:30, 30 August 2010

Untitled Document

 

 

Min Lin

 

 

 

 

 

 

 

 

Min Lin

 

 

 

 

 

MIN

 

 

 

 

 

 

MIN

 

 

 

 

 

 

 

 

 

 

Retrieved from "http://2010.igem.org/Team:UCSF/Search"