On the sample
http://milonic.com/menusample17.php
it states " The Rollover/swap Images sample is a work in progess and should be completed very soon". How SOON is SOON?
Also this menu is in a fixed location so as the browser is resized all the content moves around underneath. What's the best technique (layers not tables) for a site that is centered horizontally?
Regards
Image based menu
Hi,
The sample is actually working. I think the 'work in progress' part just never got updated. This is not however an image based menu, the images are item images, not background images for the menu.
As to the other question, it would depend a lot on your site layout and just where you want the menu. For example, you have the option of screenposition="center"; as a parameter in the menu definition. You could set for example: top=10; screenposition="center"; and the menu would position 10px from the top [plus whatever margin is set on the page] and center in the browser window. As for the layer option, if you mean divs and such, the menu shouldn't be placed in a div, it's made up of divs, spans etc, and if you put it in a div some browsers cause problems with position, submenu position, downlevel non functioning. If you could give a test page with the layout you had in mind we might perhaps have some other suggestions.
Hope this helps.
Ruth
The sample is actually working. I think the 'work in progress' part just never got updated. This is not however an image based menu, the images are item images, not background images for the menu.
As to the other question, it would depend a lot on your site layout and just where you want the menu. For example, you have the option of screenposition="center"; as a parameter in the menu definition. You could set for example: top=10; screenposition="center"; and the menu would position 10px from the top [plus whatever margin is set on the page] and center in the browser window. As for the layer option, if you mean divs and such, the menu shouldn't be placed in a div, it's made up of divs, spans etc, and if you put it in a div some browsers cause problems with position, submenu position, downlevel non functioning. If you could give a test page with the layout you had in mind we might perhaps have some other suggestions.
Hope this helps.
Ruth
Hi Ruth – thanks for the response.
I think my problem is that I’m trying to attach menus to buttons which are integrated into the graphical design of the page, whereas most of the sample seem to float the menu into whitespace.
I’ve got a working version at http://www.thewayforward.com/medivet1/scripts/menu.htm
This is the way I’ve been building menus for ages, aside from the fact I’ve put the javascript links in <body> instead of <head>
The above is fine for me but a colleague who works on Macs thinks the menu is a bit sluggish. To try and resolve this I’ve built an alternative version at
http://www.thewayforward.com/medivet1/scripts/menu2.htm
This is far more responsive on the Mac but suffers from 2 problems.
1. Menu options that don’t have a dropdown aren’t acting as hyperlinks – see “Home” graphic button. I’ve added a text based “Home” button at the end of the menu and this works.
2. I’m getting a horizontal scrollbar when I rollover buttons “Partnership” and buttons to the right of “Partnership”.
Is there a way I can get the speed of menu2.htm with the functionality of menu.htm?
Am I going about this the right way? As an alternative I could put all the menu definition in “menu_data.js” but I don’t think I’ll be able to line up the menu with the rest of the site graphics. The page is fixed width and centred but the menu isn’t centred – it’s 220px from the left edge of the self-centering of the 780px wide page.
Hope I’m making sense.
I think my problem is that I’m trying to attach menus to buttons which are integrated into the graphical design of the page, whereas most of the sample seem to float the menu into whitespace.
I’ve got a working version at http://www.thewayforward.com/medivet1/scripts/menu.htm
This is the way I’ve been building menus for ages, aside from the fact I’ve put the javascript links in <body> instead of <head>
The above is fine for me but a colleague who works on Macs thinks the menu is a bit sluggish. To try and resolve this I’ve built an alternative version at
http://www.thewayforward.com/medivet1/scripts/menu2.htm
This is far more responsive on the Mac but suffers from 2 problems.
1. Menu options that don’t have a dropdown aren’t acting as hyperlinks – see “Home” graphic button. I’ve added a text based “Home” button at the end of the menu and this works.
2. I’m getting a horizontal scrollbar when I rollover buttons “Partnership” and buttons to the right of “Partnership”.
Is there a way I can get the speed of menu2.htm with the functionality of menu.htm?
Am I going about this the right way? As an alternative I could put all the menu definition in “menu_data.js” but I don’t think I’ll be able to line up the menu with the rest of the site graphics. The page is fixed width and centred but the menu isn’t centred – it’s 220px from the left edge of the self-centering of the 780px wide page.
Hope I’m making sense.
Hi marks,
In the second page you need to remove the main menu from the div. The menu is made up of divs, spans etc. and putting it in a div causes unplanned behaviour. In some browsers the menu will break, i.e. your links don't work, in others it won't render at all, in others the submenus won't work. That may also be the problem on the first page where you're using the pop function and have the buttons in divs. But, I don't have a mac so can't work on that part of it. I'll have some time a bit later this afternoon and will work on it and get back to you.
Ruth
In the second page you need to remove the main menu from the div. The menu is made up of divs, spans etc. and putting it in a div causes unplanned behaviour. In some browsers the menu will break, i.e. your links don't work, in others it won't render at all, in others the submenus won't work. That may also be the problem on the first page where you're using the pop function and have the buttons in divs. But, I don't have a mac so can't work on that part of it. I'll have some time a bit later this afternoon and will work on it and get back to you.
Ruth
The only response difference I see is in the initial showing of the sub-menus (I'm on a Mac). The first version hesitates for a split second while the images load. After the first drop I see no difference between the two pages. You might want to consider pre-loading your images.
Ruth is right about getting the menu out of any divs.
I have a graphic setup at http://westcgi.west.asu.edu/sai/ that does what you're looking for.
Ruth is right about getting the menu out of any divs.
I have a graphic setup at http://westcgi.west.asu.edu/sai/ that does what you're looking for.
John
Thanks John - not quite the same because your menus are fixed to the left edge of the browser window.
My menu floats in the center. The centering s controlled by <divs> because I'm using <divs> instead of tables for all of my sites now.
If I take the menu out the <div> my enu won't center with the rest of the page.
My menu floats in the center. The centering s controlled by <divs> because I'm using <divs> instead of tables for all of my sites now.
If I take the menu out the <div> my enu won't center with the rest of the page.
You need to get it out of the div to have it fully compatible across browsers listed. Try looking at SAMPLE 23 which talks about screenpositon and offsetsmarks wrote:The page is fixed width and centred but the menu isn’t centred – it’s 220px from the left edge of the self-centering of the 780px wide page.
Ruth