"Active" Web Page

[Pixelpusher]

So I'm working on a new 3 page website and have designed my own nav tabs for each page. What I want to accomplish is rather simple, just need a push in the proper direction and here's what I need to happen. I need the tab in each page to show as "active" when a visitor is on each page. In other words, I have a Hotel, Flights, and Cars page with buttons linked to each page respectively. When someone clicks on the "Cars" page, I need the tab on that page to show as "Active" (highlighted to be different than the other tabs.) I' know that I will need another tab for each page that will show the highlighted and active state, and I'm sure that it will be accomplished with a mouseover, but I'm not quite sure how to effectively use the mouseover in WD6.

Any ideas? Thanks so much.

[Soquili]

Hi PixelPusher,

In Web Designer 6 the active page will be "highlighted" by default when you use the Create Navbar feature.

If you want the Active look of the buttons to be different than the mouse over state you can add a mousedown layer. WD6 will use the mouse down state as the image for the currently active page.

The attached .web file contains a simply 3 state menu. The pages within the file only contain the navbar, however the buttons are work for all the pages.

The thumbnail image shows the 3 button states. Mouse Off is at the top, Mouse Over is in the center, and Mouse Down is at the bottom.

[Pixelpusher]

Let me rephrase:

I have two images. I want one to be the mouseoff and the other to be the mouseover. Obviously the mouseoff will be a link to another page. The mouseover state will become the highlighted nav on the corresponding page and the mouseoff will then become the mousover... does that make sense?

What is the easiest way to make that happen?

[gwpriester]

I think that is what Bill is referring to.

You want the nav buttons to also reflect the current page and this is something WD 6 does.

Prior to WB 6 and you can still do this, I would build two sets of buttons. One set was the buttons for the site that I would copy to all pages.

The second set was a high lighted button, which I would replace on the appropriate page. See the secondary pages on www.gwpriester.com

It is not automatic, but it works just fine.

A word of warning, if you use the Arrange > Repeat on All Pages to copy the buttons on each page, do not use Arrange > Update Repeating Items because this will really mess up your custom buttons.

[Pixelpusher]

Thank you for the responses. Where I seem to be having trouble is in the layers galley. Do I need to create a new layer for each of the images and if so, how do I link those images to the appropriate layer in the layer gallery, thus creating my mouseover state?

[gwpriester]

There are slide show templates that allow you to import a set of images and create an automatic slide show. (Designs Gallery > Photo Galleries).

There is supposedly a way to import a set of photos and automatically replace the ones in the template. I did not have any success with this. However, you can drag and drop a photo onto one of the thumbnail photos to replace it. When you are done you have a slide show (there are quite a few different templates) without having to worry about layers, linking, etc.

You can also create your own slide show from scratch. Create a separate layer for each photo and place each photo on the appropriate layer. Then link the appropriate button to the appropriate layer. These layers are pop up layers and you can link to them either as a direct link (Links > Link to Popup Layer) or as a MouseOver effect, (Mouseover > Link to Popup Layer).

[Pixelpusher]

Sorry, but you lost me with that response. I'm not creating a slideshow, I'm creating a three button navigation and need to know exactly how to bring my images in to use as a nav button with a rollover effect.

[covoxer]

See attached.

[Pixelpusher]

That's it, but I need an explanation to know how it was done. I'm adding buttons to an existing page (two for flights, two for hotels, and two for cars.) One will be for the mouseoff and the other for the mouseover. A total of 6.

[steve.ledger]

Open the Page & Layer gallery and study the layer layout, then select a tab (on the page design) and look at the Navigation Bar Properties