[Pro] CSS Menus Acton and Focus

Hi,

Is there any way to set Focus to menus that were created with the CSS Menus Action? Like with an Extension or something?

Thank you.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Yes, it is possible. The way I do it is the give each page an id by going the the Extend option in the Page menu and adding it there. Then I create a CSS style that targets that id.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks! I’m glad this is possible. I’ll give it a shot, though I’m not quite sure how to pull it off. Focus on menu items is very important for those who navigate with a keyboard–especially for those who are visually impaired.

I appreciate the help.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Sorry to jump in here but I think there may be a confusion with what you want.
Are you talking about a visual focus for the menu item (the home link is styled
differently from the others because that is the page you are currently on) or a
selection focus (so that the menu can be tabbed in and out of and used from the
keyboard)? Reading Chuckamuck’s reply his solution would would give you the
visual styling but not the selection focus.
Thanks,
Tim.

Quoting wurliuchi email@hidden:

Thanks! I’m glad this is possible. I’ll give it a shot, though I’m not quite
sure how to pull it off. Focus on menu items is very important for those who
navigate with a keyboard–especially for those who are visually impaired.

I appreciate the help.

Extend Freeway the way you want with FreewayActions.com
http://www.freewayactions.com


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks, Tim.

I need the menu item (tab) to be highlight as if it were being hovered over, but I need this when someone navigates the site with a keyboard using the tab key (or whatever key they use). I had this working when I was trying to create my site with Dreamweaver. I used the focus parameter. Is this possible to apply to menu items that were created with the CSS Menu Action? I was surprised I didn’t see that parameter in the CSS Menu Action box.

Thank you.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Tim, I just read your post again. Yes, the selection focus is what I want (in case I didn’t make that clear in my last post). Some of this terminology confuses me.

Thank you.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

No problem. Although the action will allow you to visually style the current
page link in the menu (using the Highlight Current Page checkbox) I don’t think
it currently supports keyboard access.
Are either of these examples close to what you are looking for where you can use
the keyboard to navigate the menus?;
http://coinet.org.uk/
http://www.tjkdesign.com/articles/keyboard_friendly_dropdown_menu/default.asp

There may be a way to retrofit a solution like this into the current page
depending on the functionality you need.
Regards,
Tim.

Quoting wurliuchi email@hidden:

Tim, I just read your post again. Yes, the selection focus is what I want (in
case I didn’t make that clear in my last post). Some of this terminology
confuses me.

Thank you.


Extend Freeway the way you want with FreewayActions.com
http://www.freewayactions.com


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Both those examples are pretty good. The second one’s drop-downs are very good and obvious. The top menus don’t highlight at all, though.

We do have the focus ring in most browsers, and in some we can change the way it looks (if we know how or can see to make the changes), but for a person with a visual impairment (like with only 4% of their site remaining), the more obvious the better. Many of them would like that more than turning on JAWS or Voiceover.

Take a look at these menus: http://www.northcoastsoundsystem.com

It’s a skeleton of our site I just started working on. I want the focus to be the same as the hover. Very obvious.

Thank you so much for the help. Much appreciated.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I need an editor or an edit button. “Sight,” not “site”… horrible. :wink:


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Try this;
http://www.freewayactions.com/test/cssmenufocus/

Assuming you have the tabbing preferences enabled in your browser
(Safari calls this ‘Press tab to highlight each item on a webpage’
under the Advanced tab in the Preferences) you should be able to tab
through the links in the menus and watch each one ‘light up’ as if you
had rolled over it with the mouse.

What I’ve done is to manually extend the CSS styles the CSS Menu
action creates to allow the menu items to change using the :focus
pseudo class. If you look at the page source code you’ll see where
I’ve extended the styles and added extra ones for :focus and :active.
In theory we could just use :focus to change the link style when the
item gets tabbed into but Internet Explorer has never really worked
well with this so by adding another style for :active we ensure that
we cover both IE and other, more modern, browsers.

I’ll send a bug report to Softpress and ask them to consider adding
these features when the action next gets revised. For the moment I
would suggest adding these styles manually as markup items.
I hope this helps.
Regards,
Tim.

On 27 Apr 2009, at 16:55, wurliuchi wrote:

Both those examples are pretty good. The second one’s drop-downs are
very good and obvious. The top menus don’t highlight at all, though.

We do have the focus ring in most browsers, and in some we can
change the way it looks (if we know how or can see to make the
changes), but for a person with a visual impairment (like with only
4% of their site remaining), the more obvious the better. Many of
them would like that more than turning on JAWS or Voiceover.

Take a look at these menus: http://www.northcoastsoundsystem.com

It’s a skeleton of our site I just started working on. I want the
focus to be the same as the hover. Very obvious.

Thank you so much for the help. Much appreciated.

FreewayActions.com - Freeware and shareware actions for Freeway
Express & Pro.

Protect your mailto links from being harvested by spambots with Anti
Spam.
Only available at FreewayActions.com

http://www.freewayactions.com


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

And yet another saint. Tim, that is fantastic!!! That is it exactly!!!

Thank you so much. Wow, you guys are extremely helpful. That’s two huge hurdles you guys have thrown me over today. :wink:

I’m a little unclear as to how I can get this into my pages, but let me study the code and copy it and then go into FW and mess around with getting it in there. I think I can figure it out…maybe.

Thanks again. I very much appreciate the help.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Specifically you’ll need to add the following styles to your menu page with a block of markup.

Select HTML Markup from the Page menu and in the Before end head () section paste the following CSS styles;

http://pastie.org/460648

(I would have pasted it inline using the form on the site but the message preview freaked out for some reason and put all of the code on one line).

Regards,
Tim.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Tim,

It works perfectly. Thank you so much for your help, effort, skill, and time.

Just for general information to others who may not know: One thing I noticed about Page Markup and Master Pages. If you add markup to a master page and reapply that master page to pages that already exist, the markup will not be added to that existing page. You have to paste it in each page.

Creating new pages from master pages that have markup does add that markup to the new pages.

Hope that made sense.

Thanks again.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

It did. Thanks.
It sounds either like a bug or a misguided hidden feature. :slight_smile:
Regards,
Tim.

On 28 Apr 2009, at 12:35, wurliuchi wrote:

Creating new pages from master pages that have markup does add that
markup to the new pages.

Hope that made sense.

FreewayActions.com - Freeware and shareware actions for Freeway
Express & Pro.

Protect your mailto links from being harvested by spambots with Anti
Spam.
Only available at FreewayActions.com

http://www.freewayactions.com


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options