Milonic provide full featured pull down web menus for some of the worlds largest companies
click here to see what it can do for you

Download Milonic DHTML Menu
Buy Milonic DHTML Menu

Back To Start Of Archive
Taken From The Forum: Help & Support for DHTML Menu Version 5+
Forum Topic: Click to view post
Last Updated: Saturday July 14 2012 - 06:07:53

Some pop up menu problem


Poster: chesschi
Dated: Saturday February 19 2005 - 17:16:00 GMT

I have some difficulties on using the Milonic DHTML problem
If I insert the HTML code of Milonic to use the popup menu, it seems that there is some conflict with my original code and the "menuobj" is point to null( I use MS FrontPage and it tells me). Originally if the Milonic code isn't added to the following code, it works! I dunno how to deal with it. Can anyone tell me why it will results in this problem?
Here is the code:

<html>
<style type="text/css">
<!--

.menuskin{
position:absolute;
width:165px;
background-color:menu;
border:2px solid black;
font:normal 12px Verdana;
line-height:18px;
z-index:100;
visibility:hidden;
}

.menuskin a{
text-decoration:none;
color:black;
padding-left:10px;
padding-right:10px;
}

#mouseoverstyle{
background-color:highlight;
}

#mouseoverstyle a{
color:white;
}
-->
</style>

<script type="text/javascript">

//Pop-it menu- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use

var linkset=new Array()
//SPECIFY MENU SETS AND THEIR LINKS. FOLLOW SYNTAX LAID OUT

linkset[0]='<div class="menuitems"><a href="http://dynamicdrive.com">Dynamic Drive</a></div>'
linkset[0]+='<hr>' //Optional Separator
linkset[0]+='<div class="menuitems"><a href="http://javascriptkit.com">JavaScript Kit</a></div>'
linkset[0]+='<div class="menuitems"><a href="http://freewarejava.com">Freewarejava</a></div>'

linkset[1]='<div class="menuitems"><a href="http://msnbc.com">MSNBC</a></div>'
linkset[1]+='<div class="menuitems"><a href="http://cnn.com">CNN</a></div>'
linkset[1]+='<div class="menuitems"><a href="http://abcnews.com">ABC News</a></div>'
linkset[1]+='<hr>' //Optional Separator
linkset[1]+='<div class="menuitems"><a href="http://www.washingtonpost.com">Washington Post</a></div>'

////No need to edit beyond here

var ie4=document.all
var ns6=document.getElementById&&!document.all
var ns4=document.layers

function showmenu(e,which){

if (!document.all&&!document.getElementById&&!document.layers)
return

clearhidemenu()

menuobj=ie4? document.all.popmenu : ns6? document.getElementById("popmenu") : ns4? document.popmenu : ""
menuobj.thestyle=(ie4||ns6)? menuobj.style : menuobj

if (ie4||ns6)
menuobj.innerHTML=which
else{
menuobj.document.write('<layer name=gui bgColor=#E6E6E6 width=165 onmouseover="clearhidemenu()" onmouseout="hidemenu()">'+which+'</layer>')
menuobj.document.close()
}

menuobj.contentwidth=(ie4||ns6)? menuobj.offsetWidth : menuobj.document.gui.document.width
menuobj.contentheight=(ie4||ns6)? menuobj.offsetHeight : menuobj.document.gui.document.height
eventX=ie4? event.clientX : ns6? e.clientX : e.x
eventY=ie4? event.clientY : ns6? e.clientY : e.y

//Find out how close the mouse is to the corner of the window
var rightedge=ie4? document.body.clientWidth-eventX : window.innerWidth-eventX
var bottomedge=ie4? document.body.clientHeight-eventY : window.innerHeight-eventY

//if the horizontal distance isn't enough to accomodate the width of the context menu
if (rightedge<menuobj.contentwidth)
//move the horizontal position of the menu to the left by it's width
menuobj.thestyle.left=ie4? document.body.scrollLeft+eventX-menuobj.contentwidth : ns6? window.pageXOffset+eventX-menuobj.contentwidth : eventX-menuobj.contentwidth
else
//position the horizontal position of the menu where the mouse was clicked
menuobj.thestyle.left=ie4? document.body.scrollLeft+eventX : ns6? window.pageXOffset+eventX : eventX

//same concept with the vertical position
if (bottomedge<menuobj.contentheight)
menuobj.thestyle.top=ie4? document.body.scrollTop+eventY-menuobj.contentheight : ns6? window.pageYOffset+eventY-menuobj.contentheight : eventY-menuobj.contentheight
else
menuobj.thestyle.top=ie4? document.body.scrollTop+event.clientY : ns6? window.pageYOffset+eventY : eventY
menuobj.thestyle.visibility="visible"
return false
}

function contains_ns6(a, b) {
//Determines if 1 element in contained in another- by Brainjar.com
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}

function hidemenu(){
if (window.menuobj)
menuobj.thestyle.visibility=(ie4||ns6)? "hidden" : "hide"
}

function dynamichide(e){
if (ie4&&!menuobj.contains(e.toElement))
hidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
hidemenu()
}

function delayhidemenu(){
if (ie4||ns6||ns4)
delayhide=setTimeout("hidemenu()",500)
}

function clearhidemenu(){
if (window.delayhide)
clearTimeout(delayhide)
}

function highlightmenu(e,state){
if (document.all)
source_el=event.srcElement
else if (document.getElementById)
source_el=e.target
if (source_el.className=="menuitems"){
source_el.id=(state=="on")? "mouseoverstyle" : ""
}
else{
while(source_el.id!="popmenu"){
source_el=document.getElementById? source_el.parentNode : source_el.parentElement
if (source_el.className=="menuitems"){
source_el.id=(state=="on")? "mouseoverstyle" : ""
}
}
}
}

if (ie4||ns6)
document.onclick=hidemenu

</script>
</head>

<body>
<div id="popmenu" class="menuskin" onMouseover="clearhidemenu();highlightmenu(event,'on')" onMouseout="highlightmenu(event,'off');dynamichide(event)">
</div>

<a href="#" onMouseover="showmenu(event,linkset[0])" onMouseout="delayhidemenu()">Webmaster Links</a><br>
<a href="#" onMouseover="showmenu(event,linkset[1])" onMouseout="delayhidemenu()">News sites</a>

</body>
</html>


Poster: John
Dated: Saturday February 19 2005 - 22:03:50 GMT

I don't see any Milonic code or reference in what you have posted.

Also, when posting code, please use the code tags provided.

re: John


Poster: chesschi
Dated: Sunday February 20 2005 - 10:59:56 GMT

I just post the original code, u can put the milonic code inside <body> </body> everywhere.

Here is the milonic code:
<script type="text/javascript" src="Java/milonic_src.js"></script>
<div class="milonic">
<a href="http://www.milonic.com/">JavaScript Menu, DHTML Menu Powered By Milonic</a></div>
<script type="text/javascript">
if(ns4)_d.write("<scr"+"ipt type=text/javascript src=Java/mmenuns4.js><\/scr"+"ipt>");
else _d.write("<scr"+"ipt type=text/javascript src=Java/mmenudom.js><\/scr"+"ipt>");
</script>
<script type="text/javascript" src="Java/menu_data.js"></script>

when i use MS Frontpage, it will display "menuobj.document is null or is not an object"....if the mouse is move over the link "Webmaster Links" or "News Sites"
Originally, a popup menu will dislay when the mouse is move over the link


Poster: John
Dated: Sunday February 20 2005 - 17:59:15 GMT

Please provide a URL.

Sorry again: Re John


Poster: chesschi
Dated: Monday February 21 2005 - 3:09:01 GMT

Here is the 3 link, you can compare it

http://ihome.ust.hk/~eg_cwc/homepage/po ... y_code.htm

http://ihome.ust.hk/~eg_cwc/homepage/po ... c_code.htm
(I have been authorised to use milonic code, this one is for your reference use)

http://ihome.ust.hk/~eg_cwc/homepage/po ... d_code.htm


Description of 3 links:
------------------------------------------------------------------------------------
popup_with_my code: It's the original code that works!
popup_with_milonic_code: It's the milonic code that also works!
popup_with_combined_code: It is the combination of the above 2 codes but it fails......

Thanks a lot for your help~


Poster: John
Dated: Monday February 21 2005 - 16:43:27 GMT

Since the Milonic code is working in both cases where you have it posted (including together with the other menu code), there is nothing we can do to help. Milonic cannot debug code from someone else.

Why not use our code to do it all?