I'm using the expandable menu, where you click on a menu item and it displays sub navigation below it. Problem is, the sub navigation is positioned to the right of the main menu rather than under the menu item. Also, the sub nav displays in 2 different places each time you click on it - on the first click, the bottom of the sub nav lines up with the bottom of the menu item, and on the second click the top of the sub nav lines up with the top of the menu item. Page is at
http://128.192.46.183/warnell/udm-resources/test.html and you can see the jumping navigation best with "Student Events", "Careers & Jobs" and "Student Services". I have tried changing "reposition menus to stay within the viewport" to no avail. Menu code:
//styles which apply to the navbar
um.navbar = [
"0", // nav -> menu x-offset (+-)["n" pixels]
"0", // nav -> menu y-offset (+-)["n" pixels]
"190px", // width ["em"|"ex"|"px"] (vertical navbar only - horizontal navbar items have "auto" width) ("%" doesn't work right)
];
//styles which apply to each navbar item
um.items = [
"0", // margin between items ["n" pixels]
"1", // border size ["n" pixels] (single value only)
"collapse", // border collapse ["collapse"|"separate"] (only applies when margin = "0")
"#CACACA",// border colors ["color"|"#hex"|"rgb()"] (single, double or four values)
"solid", // border styles ["solid"|"double"|"dotted"|"dashed"|"groove"|"ridge "|"inset"|"outset"] (single, double or four values; be careful with using "none")
"#CACACA",// hover/focus border colors ["color"|"#hex"|"rgb()"] (single, double or four values)
"solid", // hover/focus border styles ["solid"|"double"|"dotted"|"dashed"|"groove"|"ridge "|"inset"|"outset"] (single, double or four values; be careful with using "none")
"#CACACA",// visited border colors ["color"|"#hex"|"rgb()"] (single, double or four values)
"solid",// visited border styles ["solid"|"double"|"dotted"|"dashed"|"groove"|"ridge "|"inset"|"outset"] (single, double or four values; be careful with using "none")
"8", // left/right padding ["n" pixels] (single value only)
"8", // top/bottom padding ["n" pixels] (single value only)
"#E3E3E3", // background ["color"|"#hex"|"rgb()"|"image.gif"]
"#CCC", // hover/focus background ["color"|"#hex"|"rgb()"|"image.gif"]
"#E3E3E3", // visited background ["color"|"#hex"|"rgb()"|"image.gif"]
"0.7em", // font size ["em"|"ex"|"%"|"px"|"pt"|"absolute-size"|"relative-size"]
"verdana, tahoma,sans-serif",// font family ["font1,font2,font3"] (always end with a generic family name)
"normal", // font weight ["normal"|"bold"|"bolder"|"lighter|"100" to "900"]
"none", // text decoration ["none"|"underline"|"overline"|"line-through"]
"left", // text-align ["left"|"right"|"center"]
"#000", // color ["color"|"#hex"|"rgb()"]
"#000", // hover/focus color ["color"|"#hex"|"rgb()"]
"#000", // visited color ["color"|"#hex"|"rgb()"]
"normal", // font-style ["normal"|"italic"|"oblique"]
"normal", // hover/focus font-style ["normal"|"italic"|"oblique"]
"normal", // visited font-style ["normal"|"italic"|"oblique"]
"letter-spacing:.1em !important;",// additional link CSS (careful!)
"", // additional hover/focus CSS (careful!)
"", // additional visited CSS (careful!)
"arrow_down.gif",// menu indicator character/image ["text"|"image.gif"|"none"]
"arrow_down.gif",// menu indicator rollover character/image ["text"|"image.gif"|"none"] (must be same type)
"16", // clipping width of indicator image ["n" pixels] (only when using image arrows)
"submenu", // alt text of indicator image ["text"] (only when using image arrows)
];
///////////////////////////////////////////////////////////////////
// MENU DEFAULT STYLES //
///////////////////////////////////////////////////////////////////
//styles which apply to each menu
um.menus = [
"0", // menu -> menu x-offset (+-)["n" pixels]
"15px", // menu -> menu y-offset (+-)["n" pixels]
"0", // border size ["n" pixels] (single value only)
"#CACACA",// border colors ["color"|"#hex"|"rgb()"] (single, double or four values)
"solid", // border styles ["solid"|"double"|"dotted"|"dashed"|"groove"|"ridge "|"inset"|"outset"] (single, double or four values; be careful with using "none")
"", // width ["em"|"ex"|"px"]
"", // padding ["n" pixels] (single value only)
"#E3E3E3", // background ["color"|"#hex"|"rgb()"|"image.gif"]
"", // additional menu CSS (careful!) (you can use a transition here but *not* a static filter)
"none",// shadow background ["color"|"#hex"|"rgb()"|"image.gif"|"none"]
"0pxs", // shadow offset (+-) ["em"|"px"|"pt"|"%"|"0"]
"filter:alpha(opacity=50);",// additional shadow layer CSS (if you use a Microsoft.Shadow filter here then Win/IE5.5+ will do that *instead* of default shadow)
];
//styles which apply to each menu item
um.menuItems = [
"0", // margin around items ["n" pixels] (single value only; margins are like table cellspacing)
"0", // border size ["n" pixels] (single value only)
"separate", // border collapse ["collapse"|"separate"] (only applies when margin = "0")
"", // border colors ["color"|"#hex"|"rgb()"] (single, double or four values)
"solid", // border styles ["solid"|"double"|"dotted"|"dashed"|"groove"|"ridge "|"inset"|"outset"] (single, double or four values; be careful with using "none")
"", // hover/focus border colors ["color"|"#hex"|"rgb()"] (single, double or four values)
"solid", // hover/focus border styles ["solid"|"double"|"dotted"|"dashed"|"groove"|"ridge "|"inset"|"outset"] (single, double or four values; be careful with using "none")
"", // visited border colors ["color"|"#hex"|"rgb()"] (single, double or four values)
"solid", // visited border styles ["solid"|"double"|"dotted"|"dashed"|"groove"|"ridge "|"inset"|"outset"] (single, double or four values; be careful with using "none")
"8", // left/right padding ["n" pixels] (single value only)
"4", // top/bottom padding ["n" pixels] (single value only)
"#EDEDED", // background ["color"|"#hex"|"rgb()"|"image.gif"]
"#EDEDED", // hover/focus background ["color"|"#hex"|"rgb()"|"image.gif"]
"#EDEDED", // visited background ["color"|"#hex"|"rgb()"|"image.gif"]
".9em", // font size ["em"|"ex"|"%"|"px"|"pt"|"absolute-size"|"relative-size"]
"Verdana, tahoma,sans-serif",// font family ["font1,font2,font3"] (always end with a generic family name)
"normal", // font weight ["normal"|"bold"|"bolder"|"lighter|"100" to "900"]
"none", // text decoration ["none"|"underline"|"overline"|"line-through"]
"left", // text-align ["left"|"right"|"center"]
"#000", // color ["color"|"#hex"|"rgb()"]
"#000", // hover/focus color ["color"|"#hex"|"rgb()"]
"#000", // visited color ["color"|"#hex"|"rgb()"]
"normal", // font-style ["normal"|"italic"|"oblique"]
"normal", // hover/focus font-style ["normal"|"italic"|"oblique"]
"normal", // visited font-style ["normal"|"italic"|"oblique"]
"", // additional link CSS (careful!)
"", // additional hover/focus CSS (careful!)
"", // additional visited CSS (careful!)
"arrow_down.gif",// submenu indicator character/image ["text"|"image.gif"|"none"]
"arrow_down.gif",// submenu indicator rollover character/image ["text"|"image.gif"|"none"] (must be the same type)
"16", // clipping width of indicator image ["n" pixels] (only when using image arrows)
"..", // alt text of indicator image ["text"] (only when using image arrows)
];
Thanks for any help!
Rhett
Sub navigation position problems Expandable Menu
Linear Mode
