1//** Chrome Drop Down Menu- Author: Dynamic Drive (http://www.dynamicdrive.com) 2 3//** Updated: July 14th 06' to v2.0 4 //1) Ability to "left", "center", or "right" align the menu items easily, just by modifying the CSS property "text-align". 5 //2) Added an optional "swipe down" transitional effect for revealing the drop down menus. 6 //3) Support for multiple Chrome menus on the same page. 7 8//** Updated: Nov 14th 06' to v2.01- added iframe shim technique 9 10//** Updated: July 23rd, 08 to v2.4 11 //1) Main menu items now remain "selected" (CSS class "selected" applied) when user moves mouse into corresponding drop down menu. 12 //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). 13 //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. 14 //4) Fixed elusive JS error in FF that sometimes occurs when mouse quickly moves between main menu items and drop down menus 15 16//** Updated: Oct 29th, 08 to v2.5 (only .js file modified from v2.4) 17 //1) Added ability to customize reveal animation speed (# of steps) 18 //2) Menu now works in IE8 beta2 (a valid doctype at the top of the page is required) 19 20var cssdropdown={ 21disappeardelay: 250, //set delay in miliseconds before menu disappears onmouseout 22dropdownindicator: '<img src="down.gif" border="0" />', //specify full HTML to add to end of each menu item with a drop down menu 23enablereveal: [false, 5], //enable swipe effect? [true/false, steps (Number of animation steps. Integer between 1-20. Smaller=faster)] 24enableiframeshim: 1, //enable "iframe shim" in IE5.5 to IE7? (1=yes, 0=no) 25 26//No need to edit beyond here//////////////////////// 27 28dropmenuobj: null, asscmenuitem: null, domsupport: document.all || document.getElementById, standardbody: null, iframeshimadded: false, revealtimers: {}, 29 30getposOffset:function(what, offsettype){ 31 var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop; 32 var parentEl=what.offsetParent; 33 while (parentEl!=null){ 34 totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop; 35 parentEl=parentEl.offsetParent; 36 } 37 return totaloffset; 38}, 39 40css:function(el, targetclass, action){ 41 var needle=new RegExp("(^|\\s+)"+targetclass+"($|\\s+)", "ig") 42 if (action=="check") 43 return needle.test(el.className) 44 else if (action=="remove") 45 el.className=el.className.replace(needle, "") 46 else if (action=="add" && !needle.test(el.className)) 47 el.className+=" "+targetclass 48}, 49 50showmenu:function(dropmenu, e){ 51 if (this.enablereveal[0]){ 52 if (!dropmenu._trueheight || dropmenu._trueheight<10) 53 dropmenu._trueheight=dropmenu.offsetHeight 54 clearTimeout(this.revealtimers[dropmenu.id]) 55 dropmenu.style.height=dropmenu._curheight=0 56 dropmenu.style.overflow="hidden" 57 dropmenu.style.visibility="visible" 58 this.revealtimers[dropmenu.id]=setInterval(function(){cssdropdown.revealmenu(dropmenu)}, 10) 59 } 60 else{ 61 dropmenu.style.visibility="visible" 62 } 63 this.css(this.asscmenuitem, "selected", "add") 64}, 65 66revealmenu:function(dropmenu, dir){ 67 var curH=dropmenu._curheight, maxH=dropmenu._trueheight, steps=this.enablereveal[1] 68 if (curH<maxH){ 69 var newH=Math.min(curH, maxH) 70 dropmenu.style.height=newH+"px" 71 dropmenu._curheight= newH + Math.round((maxH-newH)/steps) + 1 72 } 73 else{ //if done revealing menu 74 dropmenu.style.height="auto" 75 dropmenu.style.overflow="hidden" 76 clearInterval(this.revealtimers[dropmenu.id]) 77 } 78}, 79 80clearbrowseredge:function(obj, whichedge){ 81 var edgeoffset=0 82 if (whichedge=="rightedge"){ 83 var windowedge=document.all && !window.opera? this.standardbody.scrollLeft+this.standardbody.clientWidth-15 : window.pageXOffset+window.innerWidth-15 84 var dropmenuW=this.dropmenuobj.offsetWidth 85 if (windowedge-this.dropmenuobj.x < dropmenuW) //move menu to the left? 86 edgeoffset=dropmenuW-obj.offsetWidth 87 } 88 else{ 89 var topedge=document.all && !window.opera? this.standardbody.scrollTop : window.pageYOffset 90 var windowedge=document.all && !window.opera? this.standardbody.scrollTop+this.standardbody.clientHeight-15 : window.pageYOffset+window.innerHeight-18 91 var dropmenuH=this.dropmenuobj._trueheight 92 if (windowedge-this.dropmenuobj.y < dropmenuH){ //move up? 93 edgeoffset=dropmenuH+obj.offsetHeight 94 if ((this.dropmenuobj.y-topedge)<dropmenuH) //up no good either? 95 edgeoffset=this.dropmenuobj.y+obj.offsetHeight-topedge 96 } 97 } 98 return edgeoffset 99}, 100 101dropit:function(obj, e, dropmenuID){ 102 if (this.dropmenuobj!=null) //hide previous menu 103 this.hidemenu() //hide menu 104 this.clearhidemenu() 105 this.dropmenuobj=document.getElementById(dropmenuID) //reference drop down menu 106 this.asscmenuitem=obj //reference associated menu item 107 this.showmenu(this.dropmenuobj, e) 108 this.dropmenuobj.x=this.getposOffset(obj, "left") 109 this.dropmenuobj.y=this.getposOffset(obj, "top") 110 this.dropmenuobj.style.left=this.dropmenuobj.x-this.clearbrowseredge(obj, "rightedge")+"px" 111 this.dropmenuobj.style.top=this.dropmenuobj.y-this.clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+1+"px" 112 this.positionshim() //call iframe shim function 113}, 114 115positionshim:function(){ //display iframe shim function 116 if (this.iframeshimadded){ 117 if (this.dropmenuobj.style.visibility=="visible"){ 118 this.shimobject.style.width=this.dropmenuobj.offsetWidth+"px" 119 this.shimobject.style.height=this.dropmenuobj._trueheight+"px"
120 this.shimobject.style.left=parseInt(this.dropmenuobj.style.left)+"px" 121 this.shimobject.style.top=parseInt(this.dropmenuobj.style.top)+"px" 122 this.shimobject.style.display="block" 123 } 124 } 125}, 126 127hideshim:function(){ 128 if (this.iframeshimadded) 129 this.shimobject.style.display='none' 130}, 131 132isContained:function(m, e){ 133 var e=window.event || e 134 var c=e.relatedTarget || ((e.type=="mouseover")? e.fromElement : e.toElement) 135 while (c && c!=m)try {c=c.parentNode} catch(e){c=m} 136 if (c==m) 137 return true 138 else 139 return false 140}, 141 142dynamichide:function(m, e){ 143 if (!this.isContained(m, e)){ 144 this.delayhidemenu() 145 } 146}, 147 148delayhidemenu:function(){ 149 this.delayhide=setTimeout("cssdropdown.hidemenu()", this.disappeardelay) //hide menu 150}, 151 152hidemenu:function(){ 153 this.css(this.asscmenuitem, "selected", "remove") 154 this.dropmenuobj.style.visibility='hidden' 155 this.dropmenuobj.style.left=this.dropmenuobj.style.top="-1000px" 156 this.hideshim() 157}, 158 159clearhidemenu:function(){ 160 if (this.delayhide!="undefined") 161 clearTimeout(this.delayhide) 162}, 163 164addEvent:function(target, functionref, tasktype){ 165 if (target.addEventListener) 166 target.addEventListener(tasktype, functionref, false); 167 else if (target.attachEvent) 168 target.attachEvent('on'+tasktype, function(){return functionref.call(target, window.event)}); 169}, 170 171startchrome:function(){ 172 if (!this.domsupport) 173 return 174 this.standardbody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body 175 for (var ids=0; ids<arguments.length; ids++){ 176 var menuitems=document.getElementById(arguments[ids]).getElementsByTagName("a") 177 for (var i=0; i<menuitems.length; i++){ 178 if (menuitems[i].getAttribute("rel")){ 179 var relvalue=menuitems[i].getAttribute("rel") 180 var asscdropdownmenu=document.getElementById(relvalue) 181 this.addEvent(asscdropdownmenu, function(){cssdropdown.clearhidemenu()}, "mouseover") 182 this.addEvent(asscdropdownmenu, function(e){cssdropdown.dynamichide(this, e)}, "mouseout") 183 this.addEvent(asscdropdownmenu, function(){cssdropdown.delayhidemenu()}, "click") 184 try{ 185 menuitems[i].innerHTML=menuitems[i].innerHTML+" "//+this.dropdownindicator 186 }catch(e){} 187 this.addEvent(menuitems[i], function(e){ //show drop down menu when main menu items are mouse over-ed 188 if (!cssdropdown.isContained(this, e)){ 189 var evtobj=window.event || e 190 cssdropdown.dropit(this, evtobj, this.getAttribute("rel")) 191 } 192 }, "mouseover") 193 this.addEvent(menuitems[i], function(e){cssdropdown.dynamichide(this, e)}, "mouseout") //hide drop down menu when main menu items are mouse out 194 this.addEvent(menuitems[i], function(){cssdropdown.delayhidemenu()}, "click") //hide drop down menu when main menu items are clicked on 195 } 196 } //end inner for 197 } //end outer for 198 if (this.enableiframeshim && document.all && !window.XDomainRequest && !this.iframeshimadded){ //enable iframe shim in IE5.5 thru IE7?
199 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>') 200 this.shimobject=document.getElementById("iframeshim") //reference iframe object 201 this.shimobject.style.filter='progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)' 202 this.iframeshimadded=true 203 } 204} //end startchrome 205 206}
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.