Master Duckling
10-31-2006, 04:27 PM
1) Script Title: AnyLink Vertical Menu
2) Script URL (on DD): http://dynamicdrive.com/dynamicindex1/anylinkvertical.htm
3) Describe problem:
How can i make it so that another dropvertical menu drops out of an already opened menu. This is my current code:
<script type="text/javascript">
/***********************************************
* AnyLink Vertical Menu- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href="index.php?p=actueelnieuws">» Actueel Nieuws</a>'
menu1[1]='<a href="index.php?p=historischnieuws">» Historisch Nieuws</a>'
menu1[2]='<a href="index.php?p=vacatures">» Vacatures</a>'
menu1[3]='<a href="index.php?p=ontwikkelingen">» Ontwikkelingen</a>'
//Contents for menu 2, and so on
var menu2=new Array()
menu2[0]='<a href="index.php?p=reguliereafdeling">» Reguliere afdeling</a>'
menu2[1]='<a href="index.php?p=vrijeschoolafdeling">» Vrije school afdeling</a>'
var menu3=new Array()
menu3[0]='<a href="index.php?p=aalgemeen">» Algemeen</a>'
menu3[1]='<a href="index.php?p=soregulier" onMouseover="dropdownmenu(this, event, menu7, \'165px\')" onMouseout="delayhidemenu()">» Regulier</a>'
menu3[2]='<a href="index.php?p=vsovrijeschool">» Vrije school</a>'
var menu4=new Array()
menu4[0]='<a href="index.php?p=aanmelding">» Aanmelding</a>'
menu4[1]='<a href="index.php?p=publicatie">» Publicatie</a>'
menu4[2]='<a href="index.php?p=verlof">» Verlof</a>'
menu4[3]='<a href="index.php?p=donateur">» Donateur</a>'
menu4[4]='<a href="index.php?p=overig">» Overig</a>'
var menu5=new Array()
menu5[0]='<a href="index.php?p=ouderraad">» Ouderraad</a>'
menu5[1]='<a href="index.php?p=mr">» MR</a>'
menu5[2]='<a href="index.php?p=stlieflandsevrienden">» St. Lieflandse vrienden</a>'
menu5[3]='<a href="index.php?p=stvriendenchristophorus">» St. vrienden Christophorus</a>'
var menu6=new Array()
menu6[0]='<a href="index.php?p=reactys">» REaCtys</a>'
menu6[1]='<a href="index.php?p=camphillchristophorus">» Camphill Christophorus</a>'
menu6[2]='<a href="index.php?p=reinaerde">» Reinaerde</a>'
menu6[3]='<a href="index.php?p=mee">» MEE</a>'
menu6[4]='<a href="http://www.rijnheuvelland.nl/home.html">» Rijn- en Heuvelland</a>'
var menu7=new Array()
menu7[0]='<a href="index.php?p=reactys">» SO</a>'
menu7[1]='<a href="index.php?p=camphillchristophorus">» VSO</a>'
var disappeardelay=250 //menu disappear speed onMouseout (in miliseconds)
var horizontaloffset=5 //horizontal offset of menu from default location. (0-5 is a good value)
/////No further editting needed
var ie4=document.all
var ns6=document.getElementById&&!document.all
if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width: 160px" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')
function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}
function showhide(obj, e, visible, hidden, menuwidth){
if (ie4||ns6)
dropmenuobj.style.left=dropmenuobj.style.top=-500
dropmenuobj.widthobj=dropmenuobj.style
dropmenuobj.widthobj.width=menuwidth
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x-obj.offsetWidth < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure+obj.offsetWidth
}
else{
var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move menu up?
edgeoffset=dropmenuobj.contentmeasure-obj.offsetHeight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either? (position at top of viewable window then)
edgeoffset=dropmenuobj.y
}
}
return edgeoffset
}
function populatemenu(what){
if (ie4||ns6)
dropmenuobj.innerHTML=what.join("")
}
function dropdownmenu(obj, e, menucontents, menuwidth){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
clearhidemenu()
dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
populatemenu(menucontents)
if (ie4||ns6){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+obj.offsetWidth+horizontaloffset+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+"px"
}
return clickreturnvalue()
}
function clickreturnvalue(){
if (ie4||ns6) return false
else return true
}
function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}
function dynamichide(e){
if (ie4&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}
function hidemenu(e){
if (typeof dropmenuobj!="undefined"){
if (ie4||ns6)
dropmenuobj.style.visibility="hidden"
}
}
function delayhidemenu(){
if (ie4||ns6)
delayhide=setTimeout("hidemenu()",disappeardelay)
}
function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}
</script>
But it doesnt seem to work. It doesnt drop out properly. It starts in the top left of the window. So its posistion isnt right.
Hope any1 can help.
2) Script URL (on DD): http://dynamicdrive.com/dynamicindex1/anylinkvertical.htm
3) Describe problem:
How can i make it so that another dropvertical menu drops out of an already opened menu. This is my current code:
<script type="text/javascript">
/***********************************************
* AnyLink Vertical Menu- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href="index.php?p=actueelnieuws">» Actueel Nieuws</a>'
menu1[1]='<a href="index.php?p=historischnieuws">» Historisch Nieuws</a>'
menu1[2]='<a href="index.php?p=vacatures">» Vacatures</a>'
menu1[3]='<a href="index.php?p=ontwikkelingen">» Ontwikkelingen</a>'
//Contents for menu 2, and so on
var menu2=new Array()
menu2[0]='<a href="index.php?p=reguliereafdeling">» Reguliere afdeling</a>'
menu2[1]='<a href="index.php?p=vrijeschoolafdeling">» Vrije school afdeling</a>'
var menu3=new Array()
menu3[0]='<a href="index.php?p=aalgemeen">» Algemeen</a>'
menu3[1]='<a href="index.php?p=soregulier" onMouseover="dropdownmenu(this, event, menu7, \'165px\')" onMouseout="delayhidemenu()">» Regulier</a>'
menu3[2]='<a href="index.php?p=vsovrijeschool">» Vrije school</a>'
var menu4=new Array()
menu4[0]='<a href="index.php?p=aanmelding">» Aanmelding</a>'
menu4[1]='<a href="index.php?p=publicatie">» Publicatie</a>'
menu4[2]='<a href="index.php?p=verlof">» Verlof</a>'
menu4[3]='<a href="index.php?p=donateur">» Donateur</a>'
menu4[4]='<a href="index.php?p=overig">» Overig</a>'
var menu5=new Array()
menu5[0]='<a href="index.php?p=ouderraad">» Ouderraad</a>'
menu5[1]='<a href="index.php?p=mr">» MR</a>'
menu5[2]='<a href="index.php?p=stlieflandsevrienden">» St. Lieflandse vrienden</a>'
menu5[3]='<a href="index.php?p=stvriendenchristophorus">» St. vrienden Christophorus</a>'
var menu6=new Array()
menu6[0]='<a href="index.php?p=reactys">» REaCtys</a>'
menu6[1]='<a href="index.php?p=camphillchristophorus">» Camphill Christophorus</a>'
menu6[2]='<a href="index.php?p=reinaerde">» Reinaerde</a>'
menu6[3]='<a href="index.php?p=mee">» MEE</a>'
menu6[4]='<a href="http://www.rijnheuvelland.nl/home.html">» Rijn- en Heuvelland</a>'
var menu7=new Array()
menu7[0]='<a href="index.php?p=reactys">» SO</a>'
menu7[1]='<a href="index.php?p=camphillchristophorus">» VSO</a>'
var disappeardelay=250 //menu disappear speed onMouseout (in miliseconds)
var horizontaloffset=5 //horizontal offset of menu from default location. (0-5 is a good value)
/////No further editting needed
var ie4=document.all
var ns6=document.getElementById&&!document.all
if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width: 160px" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')
function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}
function showhide(obj, e, visible, hidden, menuwidth){
if (ie4||ns6)
dropmenuobj.style.left=dropmenuobj.style.top=-500
dropmenuobj.widthobj=dropmenuobj.style
dropmenuobj.widthobj.width=menuwidth
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x-obj.offsetWidth < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure+obj.offsetWidth
}
else{
var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move menu up?
edgeoffset=dropmenuobj.contentmeasure-obj.offsetHeight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either? (position at top of viewable window then)
edgeoffset=dropmenuobj.y
}
}
return edgeoffset
}
function populatemenu(what){
if (ie4||ns6)
dropmenuobj.innerHTML=what.join("")
}
function dropdownmenu(obj, e, menucontents, menuwidth){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
clearhidemenu()
dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
populatemenu(menucontents)
if (ie4||ns6){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+obj.offsetWidth+horizontaloffset+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+"px"
}
return clickreturnvalue()
}
function clickreturnvalue(){
if (ie4||ns6) return false
else return true
}
function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}
function dynamichide(e){
if (ie4&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}
function hidemenu(e){
if (typeof dropmenuobj!="undefined"){
if (ie4||ns6)
dropmenuobj.style.visibility="hidden"
}
}
function delayhidemenu(){
if (ie4||ns6)
delayhide=setTimeout("hidemenu()",disappeardelay)
}
function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}
</script>
But it doesnt seem to work. It doesnt drop out properly. It starts in the top left of the window. So its posistion isnt right.
Hope any1 can help.