NAVBAR Question??

[Steve Newport]

Alright, I made this layout for yet another design for the choir page I'm working on. what I wanted to do is make everything but the buttons a background image and when the buttons are rolled-over they are to be highlighted like the first one. I can't seem to make each individual button part of the one navbar without it making multiple copies of the same button or without making all the buttons grouped as one button.

Each "button" is made of two objects: The text and the button shape it's laying upon.

I have the buttons where I want and the shape I want, and I want all the buttons in ONE navbar, but I have no clue how!

Any help will be GREATLY appreciated! Thank

Steve Newport

[Old Dog]

I can't help you much with your question, but your design is great. The water droplets in the shape of a musical note is very imaginative, and a really nice touch. If I were to change anything, it would be to move the shadow behind "Glen Oak Choir" up and to the right just a touch more. I know that would be contrary to the shadow behind the water, but I think it would give the type a little less busy look. That's just my personal opinion not a criticism, the piece is very, very nice.

Jack

[gwpriester]

Your button shapes cannot overlap one another and that is the wall you are currently up against.

This is not to say that parts of each button cannot repeat the same image as the adjacent buttons which can create the effect of the buttons being irregularly shaped.

You might have to settle for just the text part of the button changing color however.

You can create an Image Map, which will contain hot spots and can link as needed. And Xara can create irregular-shaped hot spots. But Image Maps do not have rollover effects.

Gary

Gary Priester

Moderator Person

<A HREF="http://www.gwpriester.com" TARGET=_blank>
www.gwpriester.com </a>


XaraXone

[This message was edited by Gary W. Priester on February 26, 2002 at 07:49.]

[gwpriester]

Steve

Here is a screen capture from my home page. I have used a large circle with a lowercase g as my background image. As such I can place images over the background as if it were just an image, which you cannot do in a web document, unless you are using a Cascading Style Sheet.

The area on top is an image swap area and the image changes when you mouse over the buttons. It does not overlap the buttons but appears over the background.

The buttons appear to be irregular shapes but are all the same sized rectangle.

You could probably do the slicing in Xara. I use NetObjects Fusion which creates the slices automatically.

Hope this helps.

Gary

Gary Priester

Moderator Person

<a href="http://www.gwpriester.com">
www.gwpriester.com </a>


XaraXone

[Egg Bramhill]

Gary is correct. The important thing is not to have overlaps between buttons. You can do it with some forward planning. See example
This was created using buttons of differnt sizes and user positioned.
The resulting table can be a complicated mess however.
Personally I'd recommend using the image as a background image with your buttons on a transparent overlay.
I attach the .xar file for you to take apart.
Regards
Egg

[Egg Bramhill]

P.S. As the buttons themselves are no fill no line colour you'll have to set the view quality to wireframe to see them.

[Egg Bramhill]

Sorry Steve I didn't see the part about the raised background. I think you'd have to spread the button distances quite some way apart to achieve this.
Egg

[This message was edited by Egg Bramhill on February 26, 2002 at 08:45.]

[Egg Bramhill]

... provided you would be happy with smaller raised / highlighted sections.
In the screengrab below I have turned the button outlines to red, so provided your raised sections remained within the button boundries, it can be done.
Eric

[Wolfgang]

Steve,

check your inbox for a message from me.
With this method, overlapping buttons are no problem as well.

To all the others,
this is not a secret-society thing. It just is a bit troublesome to explain, so I sent it direct to Steve. If it works out for him, there will be no problem with sharing it ..

Wolfgang

[pinkbat]

<BLOCKQUOTE><font size="-1">quote:</font><HR>Originally posted by Gary W. Priester:
But Image Maps do not have rollover effects.
<HR></BLOCKQUOTE>

Actually - technically speaking - image maps are quite capable of having mouseover javascript. However, since the imagemap is not sliced, you would need to change over the whole image each time for the altered rollover state ... which would of course be hugely wasteful and pointless.
In other words, I haven't seen any sane web designer doing it [img]/infopop/emoticons/icon_smile.gif[/img]

Regards,
Britta