spacing with image between menu points

[agerszt]

hi

i am referring to: http://www.irdium.ch/menus/test.html

if you look at the html source you see my problem

i need to add spacers between the menu items. i tried the imagewidth=n setting, but that didn't show any effect. imageheight was ok, but the width option did not stretch the image.

per workaround i've just added the same image 20 times. but there must be a more elegant way

thanks,
arie

[Hergio]

Please go to
http://milonic.com/styleproperties.php
http://milonic.com/menuproperties.php
http://milonic.com/itemproperties.php
These will show what you can do with the menu. There are a number of different things here. Namely look up itemwidth, separatorsize, and padding one or a combination of these should help you.

[agerszt]

hi

i tried the following:

aI("image=menuimages/spacerblau.jpg;itemwidth=50;imagewidth=50;oncursor=default");

whatever i did. it didn't work. imageheight works.

thanks
arie

[John]

Check this thread...
http://milonic.com/forum/viewtopic.php?t=2319.

[Hergio]

Or this too
viewtopic.php?t=2128

You werent supposed to add that stuff to the image items in between. Take those image-only items out so you just have your items. Then on your items, you can either add non-breaking spaces ( ) to the text OR increase the ITEMWIDTH of the them so there is more padding to the left and the right of each item. Regarding adding to the right hand side of the menu, the thread John posted handles that. Just make that item have an itemwidth of 100% (or a pixel length, whatever you want) and set its background image to your image and it will stretch as far as you'd like.

Best o' luck.

[agerszt]

Will that work?

The menuitems are images, and only images with rollovers. So there is no text defined at all in the menusystem. if i stretch the image, the text in the image will break, because the proportions are out of balance.

thanks,,
arie

[Ruth]

Try this

LINK REMOVED

If this is what you are trying to do, I took one of your images and made a blank one that only had the background, no words. Just right click on the far right blue space to save background as. Then in your data.js file right after the

itemwidth="100%"; put this
bgimage="spacerblau.jpg";

That puts that image as the background of the whole menu and the images go over the top of it. I used your menu_data.js file....changing the paths of course. So if you want you can just take that file and redo the paths for your site. Not sure if that's what you are trying to do.

Ruth

[agerszt]

Dear Ruth

Thanks a lot. Nearly I want some spacerblue between the items, but not to fill the horizontal width 100%.

My final goal is: http://www.swisseasy.net/new/

You see some spacerblue images between the individual items an a bigger spacer before Kundenbereich.

So I think I need to add an additional image between each menu item which could be defined to the needs (width in pixels).

does that work?

thanks,

arie

[Ruth]

No, you don't need to do that. Go back to the link I gave. I've changed the menu_data.js file and I think that it is what you want. Take a look at the menu_data.js file....make SURE that the padding is set to 0 or it will not work, it extends the background image down and looks terrible. Anyway, I think what's up there now is what you want. I got rid of the image=kundenbereich.jpg;overimage=kundenbereich.jpg" and instead I put in an actual image before the url, and set the align for the image to right. That means even if the browser window size changes that image will be to the right and there will be a blue space between it and the partner image. It works in IE, and if you insert an itemwidth="100%" in the style definition section it also works in Opera6. As to other browsers, I don't know, but at least you now have an example of what you want it to be. and perhaps can figure how to make it do that in other browsers.. It doesn't work in NN4x. Good Luck. Let me know when you have the files so I can delete them from my domain. Thanks

Ruth

[agerszt]

Hi Ruth

Thanks for that so far. I wanted to ask you, if I can move the first 4 items (Products, Portrait, References, Partners) closer together, as in the URL I posted earlier (http://www.swisseasy.net/new)

But I think I get do that with just making spacerblau.jpg shorter.

I implemented your idea to the site. See:
http://www.irdium.ch/menus/new.html

I kept the MainMenu in the html (you do it directly in the .js). When I placed it into the js, I had problems with aligning with my tables.

How does it look on your side now?

I experience a problem, that the menu produkte isn't opening, but the others do so. Very strange...

Thank you
Arie

[Hergio]

The reason its not showing is due to a known bug in the menu that when you declare the main menu INSIDE of your page in a table cell (and not in the js file like ruth did) the first menu in the file doesn't get rendered. To fix this, you can do one of two things. First, move your main menu definition BACK into the js file and just put the <SCRIPT src=''milonic_src.js"></SCRIPT> lines in the TD instead.
Or you can put in a dummy menu definition in your menu_data file above the produkte menu.

[agerszt]

ok, i got that working, thanks! great people here by the way, that was a must say.

i am still working to find out, how i could get the menuitems closer together (my reference is the graphical design on http://www.swisseasy.net/new/)

thanks,
arie

[John]

Check http://westcgi.west.asu.edu/sai/. The 6 menu items at the top of that page are all individual graphics. I simply made them the size I needed and then did the calls in mainmenu to get them loaded.

[Ruth]

I put a new page up showing the way you want it, same link as the one before. Take the menu_data.js file and check it. I inserted 'a blank aI line after the one for the Partner, well not blank this:

Code: Select all

aI("text=<img src=spacerblau.jpg width=256 height=21 border=0>;");

One advantage to this if it works is that if someone has a smaller browser window the menu 'resizes' to fit. The page you have up, I couldn't see the last word without scrolling because the menu was wider than my browser window.

Ruth

[bomz]

Innkeeper9 said "It doesn't work in NN4x". I checked http://www.poems2u.com/agerszt/menus.htm, http://www.swisseasy.net/new/ and http://westcgi.west.asu.edu/sai/ with Netscape 4.79 and it does have problem displaying menu right (wrong menu hight). Not sure if I'm asking at right place, but is there a way to make menu with images only (no text) work correctly (beeing of right height, that is) on Netscape? Innkeeper9 suggested usign text=<img>, but then we can't use overimage. Please advise.