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:55
collapse menu and menu height and width.
Poster: kevdog98
Dated: Tuesday September 12 2006 - 15:33:23 BST
Hi,
I camn not seem to get the collapse menu set to a menu height and or width. I can get it to set the items to a wiudth and height but not the entire menu itself. I have tried using the menuheight= and menuwidth= with no luck. Please help. Bellow is the contents of my collapse_data.js
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=false // Informs the system to on;y have one menu open at a time
with(tstyle1=new mm_style()){
offbgcolor = "#CC6666";
onbgcolor = "#A45266";
offcolor="#FFFFFF";
oncolor="#FFFFFF";
subimage="trans.gif";
onsubimage="trans.gif";
clicksubimage="mis_arrow.gif";
clickbgcolor="#A45266";
bordercolor="black"
padding = 2
fontsize = "10px";
menuheight= 114
menuwidth = 423
}
sub1Style=new copyOf(tstyle1)
sub1Style.offcolor = "#A45266";
sub1Style.offbgcolor="#8EA2BB"
sub1Style.separatorcolor="#556E8C"
sub1Style.clickcolor="#A45266"
sub2Style=new copyOf(tstyle1)
sub2Style.offcolor = "#000000";
sub2Style.offbgcolor="#D6DDE6"
sub2Style.separatorcolor="#8EA2BB"
tstyle1.onbgcolor = "#A45266";
tstyle1.offbgcolor = "#CC6666";
with(new menuname("main Tree Menu")){
top=0
left=0
style = tstyle1;
alwaysvisible = 1;
//margin=AllMargin
//position="relative"
aI("text=Mission;");
aI("text=What We Believe;");
aI("text=Urban Missions;showmenu=Urban;type=tree;clickimage=mis_arrow.gif;");
aI("text=Entertainment;showmenu=Entertainment;type=tree;");
aI("text=Music;showmenu=Music;type=tree;");
aI("text=Games;");
aI("text=Relationships;");
aI("text=Travel;");
aI("text=Shopping;");
menuheight= "114";
menuwidth = "423";
}
with(new menuname("Urban")){
style = tstyle1;
margin=AllMargin
aI("text=Shoulder-to-Shoulder;url=#");
aI("text=Urban ministries;url=#");
aI("text=Urban partners;url=#");
aI("text=Classes;url=#");
}
with(new menuname("Finance")){
style = sub1Style;
margin=AllMargin
aI("text=MILONIC;url=#");
aI("text=US Markets;showmenu=US Markets;type=tree;image=lblue_blip.gif;");
aI("text=Portfolio;url=#");
aI("text=Watch list;url=#");
aI("text=Price Alert;url=#");
aI("text=Sectors;url=#");
aI("text=Advanced Chart;url=#");
}
with(new menuname("US Markets")){
style = sub2Style;
margin=AllMargin
aI("text=Market Snapshot;url=#");
aI("text=Market Movers;url=#");
aI("text=Word on The Street;url=word.php");
aI("text=Gainers/Losers;url=#");
aI("text=Most Actives;url=#");
aI("text=News;url=#");
}
with(new menuname("Sports")){
style = sub1Style;
margin=AllMargin
aI("text=MLB;url=#");
aI("text=NBA;url=#");
aI("text=NFL;url=#");
aI("text=NHL;url=#");
aI("text=College Sports;url=#");
aI("text=Golf;url=#");
}
with(new menuname("Entertainment")){
style = sub1Style;
margin=AllMargin
aI("text=Frssh;url=#");
aI("text=Cable TV Showcase;url=cable.php");
aI("text=Movie Trailers;url=#");
}
with(new menuname("Music")){
style = sub1Style;
margin=AllMargin
aI("text=Broadband Music;url=#");
}
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=false // Informs the system to on;y have one menu open at a time
with(tstyle1=new mm_style()){
offbgcolor = "#CC6666";
onbgcolor = "#A45266";
offcolor="#FFFFFF";
oncolor="#FFFFFF";
subimage="trans.gif";
onsubimage="trans.gif";
clicksubimage="mis_arrow.gif";
clickbgcolor="#A45266";
bordercolor="black"
padding = 2
fontsize = "10px";
menuheight= 114
menuwidth = 423
}
sub1Style=new copyOf(tstyle1)
sub1Style.offcolor = "#A45266";
sub1Style.offbgcolor="#8EA2BB"
sub1Style.separatorcolor="#556E8C"
sub1Style.clickcolor="#A45266"
sub2Style=new copyOf(tstyle1)
sub2Style.offcolor = "#000000";
sub2Style.offbgcolor="#D6DDE6"
sub2Style.separatorcolor="#8EA2BB"
tstyle1.onbgcolor = "#A45266";
tstyle1.offbgcolor = "#CC6666";
with(new menuname("main Tree Menu")){
top=0
left=0
style = tstyle1;
alwaysvisible = 1;
//margin=AllMargin
//position="relative"
aI("text=Mission;");
aI("text=What We Believe;");
aI("text=Urban Missions;showmenu=Urban;type=tree;clickimage=mis_arrow.gif;");
aI("text=Entertainment;showmenu=Entertainment;type=tree;");
aI("text=Music;showmenu=Music;type=tree;");
aI("text=Games;");
aI("text=Relationships;");
aI("text=Travel;");
aI("text=Shopping;");
menuheight= "114";
menuwidth = "423";
}
with(new menuname("Urban")){
style = tstyle1;
margin=AllMargin
aI("text=Shoulder-to-Shoulder;url=#");
aI("text=Urban ministries;url=#");
aI("text=Urban partners;url=#");
aI("text=Classes;url=#");
}
with(new menuname("Finance")){
style = sub1Style;
margin=AllMargin
aI("text=MILONIC;url=#");
aI("text=US Markets;showmenu=US Markets;type=tree;image=lblue_blip.gif;");
aI("text=Portfolio;url=#");
aI("text=Watch list;url=#");
aI("text=Price Alert;url=#");
aI("text=Sectors;url=#");
aI("text=Advanced Chart;url=#");
}
with(new menuname("US Markets")){
style = sub2Style;
margin=AllMargin
aI("text=Market Snapshot;url=#");
aI("text=Market Movers;url=#");
aI("text=Word on The Street;url=word.php");
aI("text=Gainers/Losers;url=#");
aI("text=Most Actives;url=#");
aI("text=News;url=#");
}
with(new menuname("Sports")){
style = sub1Style;
margin=AllMargin
aI("text=MLB;url=#");
aI("text=NBA;url=#");
aI("text=NFL;url=#");
aI("text=NHL;url=#");
aI("text=College Sports;url=#");
aI("text=Golf;url=#");
}
with(new menuname("Entertainment")){
style = sub1Style;
margin=AllMargin
aI("text=Frssh;url=#");
aI("text=Cable TV Showcase;url=cable.php");
aI("text=Movie Trailers;url=#");
}
with(new menuname("Music")){
style = sub1Style;
margin=AllMargin
aI("text=Broadband Music;url=#");
}
drawMenus()
Thank You,
Kevin
Poster: Ruth
Dated: Tuesday September 12 2006 - 17:33:53 BST
Hi,
You've got problems in your code for that main menu, try this.
Code:
with(new menuname("main Tree Menu")){
top=0;
left=0;
style = tstyle1;
alwaysvisible=1;
menuheight=114;
menuwidth=423;
//margin=AllMargin
//position="relative"
aI("text=Mission;");
aI("text=What We Believe;");
aI("text=Urban Missions;showmenu=Urban;type=tree;clickimage=mis_arrow.gif;");
aI("text=Entertainment;showmenu=Entertainment;type=tree;");
aI("text=Music;showmenu=Music;type=tree;");
aI("text=Games;");
aI("text=Relationships;");
aI("text=Travel;");
aI("text=Shopping;");
}
top=0;
left=0;
style = tstyle1;
alwaysvisible=1;
menuheight=114;
menuwidth=423;
//margin=AllMargin
//position="relative"
aI("text=Mission;");
aI("text=What We Believe;");
aI("text=Urban Missions;showmenu=Urban;type=tree;clickimage=mis_arrow.gif;");
aI("text=Entertainment;showmenu=Entertainment;type=tree;");
aI("text=Music;showmenu=Music;type=tree;");
aI("text=Games;");
aI("text=Relationships;");
aI("text=Travel;");
aI("text=Shopping;");
}
Also, you have menuheight and width set in the style section as if you are trying to get all the menus to have the same height and width. Those properties are not style properties, they are only menu properties and have to be put into each menu. Remove them from the style section.
Hope this helps
Ruth
Poster: kevdog98
Dated: Wednesday September 13 2006 - 16:14:20 BST
That did malke the menu the right size and width, but it also made ever collapse menu collapse to the same size and width. Is there a way to make just the menu be menuheight=114 menuwidth=423, but make the menu items be much small say width=423 height=30
Poster: Ruth
Dated: Wednesday September 13 2006 - 22:32:47 BST
I don't really know what you mean, can you give a us an image or something? Since this is a treemenu, when you click to open a submenu it will be the same width as the main menu below which it opens.
You can set itemheight= the same as you set the menuheight/menuwidth. However, if you set itemheight=30; then your menu is going to be higher than 114 since you have 9 items in the main menu and 9 x 30 = 270. Setting it at 30 makes the items look like they are 5-10 px apart from each other. So, if you can give us a picture of what you want, I'll try and see if I can set it up for you.
Ruth
Poster: kevdog98
Dated: Thursday September 14 2006 - 19:44:10 BST
Ruth:
Here is a screen shot of what I am trying to do.
Thanks.
Kevin
http://www.upc.org/collapse.gif
Poster: kevdog98
Dated: Monday September 18 2006 - 21:55:38 BST
Ruth, Do you have any update on this?
Kevin
Poster: Ruth
Dated: Tuesday September 19 2006 - 7:41:22 BST
Hi,
Just to make sure I understand, according to that picture you want the menu to be 114 px wide, and you want it to be 423 px high. Then you want the items to be 22 or so px high and you want all the items to sit at the top of the menu leaving the bottom part just that reddish color but empty.
If that is the case, you cannot do that with a treemenu. It's different than the regular menu in which each menu, main and subs are their own independent menus. In the treemenu, the subs are part of the 'main' menu.
Can you tell me something about the design? For example if the menu is going to be at that top left 0 position, you could create a div that would be there the height and width you wanted and the bgcolor of the menu, and just position the menu over it like you have it now.
Ruth
Poster: kevdog98
Dated: Tuesday September 19 2006 - 15:35:57 BST
Ruth:
The menu will be in the left 0 position. So what you are suggesting is creating a div that is 114px wide and 423px high, and then using the collapse menu to create a main menu with no subs? Can you give me an example?
Thanks for all your help.
Kevin
Poster: Ruth
Dated: Tuesday September 19 2006 - 18:48:58 BST
Hi Kevin,
I thought you wanted it to look like the menu was 114px wide and 423 long and it would be that size always and the submenus would open down in that area. Anyway, this is what I did: created a div on that side of the page and colored it the color of the menu bg. So the long color is the div which goes all the way up to the top. The menu sits on top of it, not in it.
EDIT: Link removed
This is what I understood you to want, however you need to be aware the menu is NOT going to stay that size if anyone sets their font size larger, it should expand to accommodate the increased font size. The only way to guarantee size is to use images.
Also, I note you have single master = false, this mean more than one submenu will be open if they click more than one, this will also make the menu go longer than the div since it will take up the necessary space it needs.
Ruth
Poster: kevdog98
Dated: Tuesday September 19 2006 - 21:50:33 BST
Thanks Ruth!
That is just what I was looking to do! Thanks for the wonderful support.
Kevin
Poster: Ruth
Dated: Wednesday September 20 2006 - 1:19:51 BST
Hi Kevin,
You're welcome. Ah, remember to remove the text I put in the div
If you can do it, I would suggest that you make the div and the menu 120px at least, 140 would be better, 120px let's someone who needs larger fonts go up 120%, 140 is equal to 150% increase in font size without the menu getting wider than the div. Of course, I realize that sometimes layout won't allow that.
Ruth
Open menu link in using target
Poster: kevdog98
Dated: Thursday September 28 2006 - 18:13:46 BST
Ruth:
Another problem I am running into is opening a menu link in a target, such as a table cell. Is there a way to do this. Basically, I need this menu to be able to remember the state, and stay open to the link that was clicked. Can I do this? How can I do this?
Poster: Ruth
Dated: Thursday September 28 2006 - 19:24:52 BST
Hi,
I have no idea how to open something in a table cell unless you put an iframe in the cell and open the page in that iframe.
I think you should post this as a new topic. Perhaps someone will have a solution.
Maybe title it target='some table cell' possible?
Ruth