Team:Tsinghua-A/template/header1js
From 2013.igem.org
(Difference between revisions)
(One intermediate revision not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
- | |||
//** Chrome Drop Down Menu- Author: Dynamic Drive (http://www.dynamicdrive.com) | //** Chrome Drop Down Menu- Author: Dynamic Drive (http://www.dynamicdrive.com) | ||
Line 14: | Line 13: | ||
//** Updated: July 23rd, 08 to v2.4 | //** Updated: July 23rd, 08 to v2.4 | ||
//1) Main menu items now remain "selected" (CSS class "selected" applied) when user moves mouse into corresponding drop down menu. | //1) Main menu items now remain "selected" (CSS class "selected" applied) when user moves mouse into corresponding drop down menu. | ||
- | //2) Adds ability to specify arbitrary HTML that gets added to the end of each menu item that carries a drop down menu (ie: a down arrow image). | + | //2) Adds ability to specify arbitrary HTML that gets added to the end of each menu item that carries a drop down menu (ie: a down arrow |
- | //3) All event handlers added to the menu are now unobstrusive, allowing you to define your own "onmouseover" or "onclick" events on the menu items. | + | |
+ | image). | ||
+ | //3) All event handlers added to the menu are now unobstrusive, allowing you to define your own "onmouseover" or "onclick" events on the | ||
+ | |||
+ | menu items. | ||
//4) Fixed elusive JS error in FF that sometimes occurs when mouse quickly moves between main menu items and drop down menus | //4) Fixed elusive JS error in FF that sometimes occurs when mouse quickly moves between main menu items and drop down menus | ||
Line 24: | Line 27: | ||
var cssdropdown={ | var cssdropdown={ | ||
disappeardelay: 250, //set delay in miliseconds before menu disappears onmouseout | disappeardelay: 250, //set delay in miliseconds before menu disappears onmouseout | ||
- | + | dropdownindicator: '<img src="down.gif" border="0" />', //specify full HTML to add to end of each menu item with a drop down menu | |
enablereveal: [true, 5], //enable swipe effect? [true/false, steps (Number of animation steps. Integer between 1-20. Smaller=faster)] | enablereveal: [true, 5], //enable swipe effect? [true/false, steps (Number of animation steps. Integer between 1-20. Smaller=faster)] | ||
enableiframeshim: 1, //enable "iframe shim" in IE5.5 to IE7? (1=yes, 0=no) | enableiframeshim: 1, //enable "iframe shim" in IE5.5 to IE7? (1=yes, 0=no) | ||
Line 30: | Line 33: | ||
//No need to edit beyond here//////////////////////// | //No need to edit beyond here//////////////////////// | ||
- | dropmenuobj: null, asscmenuitem: null, domsupport: document.all || document.getElementById, standardbody: null, iframeshimadded: false, revealtimers: {}, | + | dropmenuobj: null, asscmenuitem: null, domsupport: document.all || document.getElementById, standardbody: null, iframeshimadded: false, |
+ | |||
+ | revealtimers: {}, | ||
getposOffset:function(what, offsettype){ | getposOffset:function(what, offsettype){ | ||
- | var totaloffset= | + | var totaloffset=0; |
var parentEl=what.offsetParent; | var parentEl=what.offsetParent; | ||
while (parentEl!=null){ | while (parentEl!=null){ | ||
- | totaloffset=0; | + | totaloffset=(offsettype=="left")? 0; |
parentEl=parentEl.offsetParent; | parentEl=parentEl.offsetParent; | ||
} | } | ||
Line 85: | Line 90: | ||
var edgeoffset=0 | var edgeoffset=0 | ||
if (whichedge=="rightedge"){ | if (whichedge=="rightedge"){ | ||
- | var windowedge=document.all && !window.opera? this.standardbody.scrollLeft+this.standardbody.clientWidth-15 : window.pageXOffset+window.innerWidth-15 | + | var windowedge=document.all && !window.opera? this.standardbody.scrollLeft+this.standardbody.clientWidth-15 : |
+ | |||
+ | window.pageXOffset+window.innerWidth-15 | ||
var dropmenuW=this.dropmenuobj.offsetWidth | var dropmenuW=this.dropmenuobj.offsetWidth | ||
if (windowedge-this.dropmenuobj.x < dropmenuW) //move menu to the left? | if (windowedge-this.dropmenuobj.x < dropmenuW) //move menu to the left? | ||
Line 92: | Line 99: | ||
else{ | else{ | ||
var topedge=document.all && !window.opera? this.standardbody.scrollTop : window.pageYOffset | var topedge=document.all && !window.opera? this.standardbody.scrollTop : window.pageYOffset | ||
- | var windowedge=document.all && !window.opera? this.standardbody.scrollTop+this.standardbody.clientHeight-15 : window.pageYOffset+window.innerHeight-18 | + | var windowedge=document.all && !window.opera? this.standardbody.scrollTop+this.standardbody.clientHeight-15 : |
+ | |||
+ | window.pageYOffset+window.innerHeight-18 | ||
var dropmenuH=this.dropmenuobj._trueheight | var dropmenuH=this.dropmenuobj._trueheight | ||
if (windowedge-this.dropmenuobj.y < dropmenuH){ //move up? | if (windowedge-this.dropmenuobj.y < dropmenuH){ //move up? | ||
Line 195: | Line 204: | ||
} | } | ||
}, "mouseover") | }, "mouseover") | ||
- | this.addEvent(menuitems[i], function(e){cssdropdown.dynamichide(this, e)}, "mouseout") //hide drop down menu when main menu items are mouse out | + | this.addEvent(menuitems[i], function(e){cssdropdown.dynamichide(this, e)}, "mouseout") //hide drop down menu |
- | this.addEvent(menuitems[i], function(){cssdropdown.delayhidemenu()}, "click") //hide drop down menu when main menu items are clicked on | + | |
+ | when main menu items are mouse out | ||
+ | this.addEvent(menuitems[i], function(){cssdropdown.delayhidemenu()}, "click") //hide drop down menu when main | ||
+ | |||
+ | menu items are clicked on | ||
} | } | ||
} //end inner for | } //end inner for | ||
} //end outer for | } //end outer for | ||
if (this.enableiframeshim && document.all && !window.XDomainRequest && !this.iframeshimadded){ //enable iframe shim in IE5.5 thru IE7? | if (this.enableiframeshim && document.all && !window.XDomainRequest && !this.iframeshimadded){ //enable iframe shim in IE5.5 thru IE7? | ||
- | document.write('<IFRAME id="iframeshim" src="about:blank" frameBorder="0" scrolling="no" style="left:0; top:0; position:absolute; display:none;z-index:90; background: transparent;"></IFRAME>') | + | document.write('<IFRAME id="iframeshim" src="about:blank" frameBorder="0" scrolling="no" style="left:0; top:0; |
+ | |||
+ | position:absolute; display:none;z-index:90; background: transparent;"></IFRAME>') | ||
this.shimobject=document.getElementById("iframeshim") //reference iframe object | this.shimobject=document.getElementById("iframeshim") //reference iframe object | ||
this.shimobject.style.filter='progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)' | this.shimobject.style.filter='progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)' |
Latest revision as of 19:02, 26 September 2013