Rollover horizontal list navbar

item 1

item 2

item 3

item 4

Compare to CSS

I've used this action before in the previous version of freeway. It's pretty easy to apply, simply sketch a table one row high and as many columns as you have menu items. Fill the cells with your links, select your options, a little text styling, and you're done.

This method is also much easier to visualize in Freeway than the CSS method I came up with. But it also relies on more code -- at least 3 .js files in the resources folder in addition to what it adds in the page itself. Although it seems to work well enough, I haven't tested it with very many browsers (and no WIN browsers).

Some problems I noticed with this version: the menubar now stretches across the width of the page, and there seems to be no easy way to make it do otherwise. When I tried pasting the table into a containing div, it stopped trying to stretch -- but then gave me odd behaviors with the rollovers. Documentation on this rollover at the SP Knowledgebase was unsatisfyingly brief.

Another problem I was unable to solve was controlling the link underlines. I am currently running with just the actions that came with the Fwy4 installation, so I don't have any of the previous actions I relied on for that. The Menu Bar action itself seems to imply control of link underlines, but doesn't seem able to disable them. Since they are already there, the button to enable them seems a bit confusing.

markup validation | css validation | download the source file (180.94 K) (Freeway Pro 4 required)