Industrial Strength JavaScript and DHTML Menus
About Us
Testimonials
Contact Us
Our Distinguished Clients
Investing in Non-Profits
Where Are We
Privacy Policy
Software Licensing Agreement
DHTML JavaScript Menu
Product Information
Page Integration
Quick Reference Guides
Embedding Into a Table or DIV
Purchase
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:35
Menu position floats to top in IE
Poster: ssegura
Dated: Thursday May 3 2007 - 15:50:26 BST
Ruth,
I have been working with the collapsible menu and the dhtml menu and
thought I had them working together. Originally I created one
menu_data.js file but now I believe I will need to separate them. More
maintenance but this is fine if I can get the collapsible menu to work
correctly.
I have created a template and inserted the collapsible menu in a table. I
am working in an Oracle portal environment using milonic_src.js and
mmenudom.js version 5.770. I am using treemenu.js version 1.26. I am
using the showmenu property in the menu_data.js file and calling a guid
number generated by Oracle portal. I use this in the main table menu also
by calling drawMenus();openBranchByName(guid);
The menu works great, however the issue is when I use IE to render
pages. The menu opens great and works properly however when I do a
refresh the submenu moves to the top-left of the page. This has been IE
specific. I test extensively and sometimes the menu moves after a couple
of refreshes and sometimes I have to refresh about 15 times. Either way
it moves.
The url below is an example of the menu. Please open the menu and
refresh the page. Refresh multiple times and you will eventually see the
change.
I have reviewed the latest version content on http://www.milonic.com and I know
the latest version is 5.772 but do not see a resolution for this.
I am at a loss with this and after extensive troubleshooting on my end I
hope you can look at my code and find and easy solution. The
menu_data.js code is also below. Thanks in advance for your assistance.
Steve
http://preview.lcra.org/newsletter/webt ... index.html
Code:
_scrollAmount=5 // Used for Netscape 4 scrolling
_scrollDelay=10 // Used for Netscape 4 scrolling
_menuCloseDelay=500 // The delay for menus to remain visible on mouse off
_menuOpenDelay=150 // The delay for opening menus on mouse over
_subOffsetTop=0; // Sub menu offset Top position
_subOffsetLeft=0; // Sub menu offset Left position
Goverfilter="Alpha(style=1,opacity=25,finishOpacity=100,startX=0,finishX=100,startY=100,
finishY=0);Fade(duration=0.2);Shadow(color='#777777', Direction=135, Strength=5)"
Goverfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color='#777777',
Direction=135, Strength=5)"
Goutfilter="randomdissolve(duration=0.3)"
Goutfilter=""
Goverfilter=""
AllMargin=0
treeOffset=0; // Used to set the offset of sub menus
singleMasterMenu=true // Informs the system to on;y have one menu open at a time
with(tstyle1=new mm_style()){
offcolor = "#2b4560"; // Blue color for left nav text links
fontweight = "bold"; // Font style property of left nav
onbgcolor = "#cccccc"; // Rollover background color of left nav
oncolor = "#2b4560"; // Rollover blue color of left nav links
offbgcolor="";
ondecoration="underline";
borderstyle = "solid";
subimage="/library/media/public/images/general/arrow_nav_t.gif";
onsubimage="/library/media/public/images/general/arrow_nav_down_t.gif";
bordercolor="";
borderwidth=0;
padding = 2;
fontsize = "10px";
fontfamily = "Verdana, Geneva, Arial, Helvetica, sans-serif";
subimageposition="top left" ;
separatorsize=1;
separatorcolor="#ffffff";
subimagepadding=3;
imagepadding=2;
itemwidth="131";
}
sub1Style=new copyOf(tstyle1)
sub1Style.offcolor = "#2b4560";
sub1Style.fontweight = "bold";
sub1Style.onbgcolor="#ffffff";
sub1Style.offbgcolor="#cccccc";
sub1Style.separatorcolor="#ffffff";
sub1Style.pagecolor="#550016";
sub2Style=new copyOf(tstyle1)
sub2Style.offcolor = "#2b4560";
sub2Style.fontweight = "normal";
sub2Style.onbgcolor="#ffffff";
sub2Style.offbgcolor="#ffffff";
sub2Style.separatorcolor="#ffffff";
sub2Style.pagecolor="#550016";
sub3Style=new copyOf(tstyle1)
sub3Style.offcolor = "#2b4560";
sub3Style.fontweight = "normal";
sub3Style.onbgcolor="#ffffff";
sub3Style.offbgcolor="#ffffff";
sub3Style.separatorcolor="#ffffff";
sub3Style.pagecolor="#550016";
tstyle1.clickbgcolor="#cccccc";
tstyle1.pagecolor="#550016"; // Color of left nav link to show which page is selected
with(new menuname("dummy")){
style=sub2Style;
margin=AllMargin
}
// Begin Overview section
with(new menuname("2C5D5C7A3A792D19E04012ACA90C0380")){
style = sub2Style;
aI("text=History;url=/overview/history/index.html;
showmenu=2CC4092F7E888208E04012ACA90C5F42;type=tree;");
//aI("text=Faq;url=/about/faq.html;
showmenu=2CAEA95AE1CD1E08E04012ACA90C5718;type=tree;");
//aI("text=Maps;url=/about/lcra_facilities.html;
showmenu=2CAEA9DB604B8D0AE04012ACA90C571D;type=tree;");
//aI("text=Public Meeting Calendar;url=/about/meetings.html;
showmenu=2C9C4857F99B7FA2E04012ACA90C6B75;type=tree;");
//aI("text=Financial Highlights;url=/about/finance.html;
showmenu=2CC09FE38D401F8EE04012ACA90C1D3C;type=tree;");
//aI("text=Enabling Legislation;url=/about/lcra_enabling_legislation.html;
showmenu=2CC09D2B0EFF2751E04012ACA90C1D3E;type=tree;");
//aI("text=Open Records Information;url=/about/openrecords.html;
showmenu=2CC2669A79851EB1E04012ACA90C31C3;type=tree;");
//aI("text=Contact LCRA;url=/contact.html;
showmenu=2DD6B23502108A96E04012AC51EC3B39;type=tree;");
}
// History submenu
with(new menuname("2CC4092F7E888208E04012ACA90C5F42")){
style = sub3Style;
aI("text=Early Years;url=/overview/history/history2.html;
showmenu=2CC4092F7EB08208E04012ACA90C5F42;type=tree;");
aI("text=An Era of Change;url=/overview/history/history3.html;
showmenu=2CC2FE01DDBC7B93E04012ACA90C5E2D;type=tree;");
}
// History - Early Years submenu
with(new menuname("2CC4092F7EB08208E04012ACA90C5F42")){
style = sub3Style;
margin=AllMargin
}
// History - An Era of Change submenu
with(new menuname("2CC2FE01DDBC7B93E04012ACA90C5E2D")){
style = sub3Style;
margin=AllMargin
}
drawMenus()
_scrollDelay=10 // Used for Netscape 4 scrolling
_menuCloseDelay=500 // The delay for menus to remain visible on mouse off
_menuOpenDelay=150 // The delay for opening menus on mouse over
_subOffsetTop=0; // Sub menu offset Top position
_subOffsetLeft=0; // Sub menu offset Left position
Goverfilter="Alpha(style=1,opacity=25,finishOpacity=100,startX=0,finishX=100,startY=100,
finishY=0);Fade(duration=0.2);Shadow(color='#777777', Direction=135, Strength=5)"
Goverfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color='#777777',
Direction=135, Strength=5)"
Goutfilter="randomdissolve(duration=0.3)"
Goutfilter=""
Goverfilter=""
AllMargin=0
treeOffset=0; // Used to set the offset of sub menus
singleMasterMenu=true // Informs the system to on;y have one menu open at a time
with(tstyle1=new mm_style()){
offcolor = "#2b4560"; // Blue color for left nav text links
fontweight = "bold"; // Font style property of left nav
onbgcolor = "#cccccc"; // Rollover background color of left nav
oncolor = "#2b4560"; // Rollover blue color of left nav links
offbgcolor="";
ondecoration="underline";
borderstyle = "solid";
subimage="/library/media/public/images/general/arrow_nav_t.gif";
onsubimage="/library/media/public/images/general/arrow_nav_down_t.gif";
bordercolor="";
borderwidth=0;
padding = 2;
fontsize = "10px";
fontfamily = "Verdana, Geneva, Arial, Helvetica, sans-serif";
subimageposition="top left" ;
separatorsize=1;
separatorcolor="#ffffff";
subimagepadding=3;
imagepadding=2;
itemwidth="131";
}
sub1Style=new copyOf(tstyle1)
sub1Style.offcolor = "#2b4560";
sub1Style.fontweight = "bold";
sub1Style.onbgcolor="#ffffff";
sub1Style.offbgcolor="#cccccc";
sub1Style.separatorcolor="#ffffff";
sub1Style.pagecolor="#550016";
sub2Style=new copyOf(tstyle1)
sub2Style.offcolor = "#2b4560";
sub2Style.fontweight = "normal";
sub2Style.onbgcolor="#ffffff";
sub2Style.offbgcolor="#ffffff";
sub2Style.separatorcolor="#ffffff";
sub2Style.pagecolor="#550016";
sub3Style=new copyOf(tstyle1)
sub3Style.offcolor = "#2b4560";
sub3Style.fontweight = "normal";
sub3Style.onbgcolor="#ffffff";
sub3Style.offbgcolor="#ffffff";
sub3Style.separatorcolor="#ffffff";
sub3Style.pagecolor="#550016";
tstyle1.clickbgcolor="#cccccc";
tstyle1.pagecolor="#550016"; // Color of left nav link to show which page is selected
with(new menuname("dummy")){
style=sub2Style;
margin=AllMargin
}
// Begin Overview section
with(new menuname("2C5D5C7A3A792D19E04012ACA90C0380")){
style = sub2Style;
aI("text=History;url=/overview/history/index.html;
showmenu=2CC4092F7E888208E04012ACA90C5F42;type=tree;");
//aI("text=Faq;url=/about/faq.html;
showmenu=2CAEA95AE1CD1E08E04012ACA90C5718;type=tree;");
//aI("text=Maps;url=/about/lcra_facilities.html;
showmenu=2CAEA9DB604B8D0AE04012ACA90C571D;type=tree;");
//aI("text=Public Meeting Calendar;url=/about/meetings.html;
showmenu=2C9C4857F99B7FA2E04012ACA90C6B75;type=tree;");
//aI("text=Financial Highlights;url=/about/finance.html;
showmenu=2CC09FE38D401F8EE04012ACA90C1D3C;type=tree;");
//aI("text=Enabling Legislation;url=/about/lcra_enabling_legislation.html;
showmenu=2CC09D2B0EFF2751E04012ACA90C1D3E;type=tree;");
//aI("text=Open Records Information;url=/about/openrecords.html;
showmenu=2CC2669A79851EB1E04012ACA90C31C3;type=tree;");
//aI("text=Contact LCRA;url=/contact.html;
showmenu=2DD6B23502108A96E04012AC51EC3B39;type=tree;");
}
// History submenu
with(new menuname("2CC4092F7E888208E04012ACA90C5F42")){
style = sub3Style;
aI("text=Early Years;url=/overview/history/history2.html;
showmenu=2CC4092F7EB08208E04012ACA90C5F42;type=tree;");
aI("text=An Era of Change;url=/overview/history/history3.html;
showmenu=2CC2FE01DDBC7B93E04012ACA90C5E2D;type=tree;");
}
// History - Early Years submenu
with(new menuname("2CC4092F7EB08208E04012ACA90C5F42")){
style = sub3Style;
margin=AllMargin
}
// History - An Era of Change submenu
with(new menuname("2CC2FE01DDBC7B93E04012ACA90C5E2D")){
style = sub3Style;
margin=AllMargin
}
drawMenus()
Poster: Ruth
Dated: Thursday May 3 2007 - 20:18:23 BST
Hi,
Try moving that openBranch call to the last thing before the closing body tag. So, you'll have a drawMenus(); at the end of the tree menu, and then before the closing body tag you'll have
Code:
<script type="text/javascript">
drawMenus();
openBranchByName(guid);
</script>
</BODY>
drawMenus();
openBranchByName(guid);
</script>
</BODY>
I tried that and it seems to work. I think it might be a timing issue of some kind on the page loading/reloading. Somehow it may be getting the info on the history menu to be open before the table with the main tree is fully built so it shifts the history up to the top of the page. With the call just before the close then everything else is loaded - maybe?????
Ruth
Menu position floats to top in IE
Poster: ssegura
Dated: Friday May 4 2007 - 17:14:35 BST
Ruth,
You are so wonderful and awesome. The code fix you gave me worked great and I am able to use the menu_data.js files I originally created. This allows me to have the top and left navigation in a single file.
I modified the code you sent slightly and added this to the bottom of the page.
<script type="text/javascript">openBranchByName(guid);</script>
Adding the drawMenus(); code at the bottom was generating the left menu twice as it would flash twice when I selected a page. When I tried to remove the drawMenus(); code from the table cell the menu would not show. If this is not the most efficient way to do this, please let me know.
I had been struggling with this for sometime and in working with you I knew you would have a quick fix. You have been able to answer every question I have sent your way. Thanks so much for responding so quickly to this issue. I can breathe easier and enjoy the weekend.
I hope that you will have a great weekend as well.
A much satisfied customer.
Steve