[WSG] Drop-down menu issues
I've been struggling with a horizontal drop-down menu that came to us and we have no control over.. 1. fly-outs to 3 levels 2. only the final element in the fly out has a link. There is no left-hand menu to take some of the pressure off the fly-outs... I did add an additional skip link to the site map just before the navigation... We are the production team and this was decided and designed long before we were involved. although I raised concerns from the beginning. The menu items are added dynamically by the content management team using Vignette now OpenText. Originally I used the original Suckerfish and I removed the a href ..if there was no link. works wonderfully with a screenreader (better and easier than a mouse user), however there is no visual for the keyboard only user however, this user can tab from link to link. this user misses the content for the non-link area. Other issues have come up non-508 and it was extremely challenging to style each level with and without a link. Then I discovered Superfish and wanted to upgrade the technology, however it won't work for keyboard only users without a link. Question... Is it appropiate to use a href=# or any other means to indicate no link? there is no onclick event straight html. Is there something else? Would WAI-Aria roles work here? If so could someone point me to an easy tutorial with more examples than lots of text.? Thanks, Nancy *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Drop-down menu issues
go die 2011/7/29 Nancy Johnson njohnso...@gmail.com I've been struggling with a horizontal drop-down menu that came to us and we have no control over.. 1. fly-outs to 3 levels 2. only the final element in the fly out has a link. There is no left-hand menu to take some of the pressure off the fly-outs... I did add an additional skip link to the site map just before the navigation... We are the production team and this was decided and designed long before we were involved. although I raised concerns from the beginning. The menu items are added dynamically by the content management team using Vignette now OpenText. Originally I used the original Suckerfish and I removed the a href ..if there was no link. works wonderfully with a screenreader (better and easier than a mouse user), however there is no visual for the keyboard only user however, this user can tab from link to link. this user misses the content for the non-link area. Other issues have come up non-508 and it was extremely challenging to style each level with and without a link. Then I discovered Superfish and wanted to upgrade the technology, however it won't work for keyboard only users without a link. Question... Is it appropiate to use a href=# or any other means to indicate no link? there is no onclick event straight html. Is there something else? Would WAI-Aria roles work here? If so could someone point me to an easy tutorial with more examples than lots of text.? Thanks, Nancy *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** -- Best Wishes , Yours sincerely, Garment4u Team Album: Shoes : http://picasaweb.google.it/fashionSHOESforyou http://picasaweb.google.it/garment4uno2 http://picasaweb.google.it/garment4uno1 http://picasaweb.google.it/garment4uno3 http://picasaweb.google.it/garment4uno3 http://picasaweb.google.it/uggbootsforyouhttp://picasaweb.google.ru/uggbootsforyou Bag: http://picasaweb.google.it/fashionBAGforyou4 http://picasaweb.google.it/fashionBAGforyou3 http://picasaweb.google.it/fashionBAGforyou2 http://picasaweb.google.it/fashionBAGforyou Dresswear: http://picasaweb.google.ru/fashiondressforyou7 http://picasaweb.google.ru/fashiondressforyou6 http://picasaweb.google.it/fashionDRESSforyou3http://picasaweb.google.it/fashionDRESSforyou2 http://picasaweb.google.it/fashionDRESSforyou2http://picasaweb.google.it/fashionDRESSforyou http://picasaweb.google.it/fashionDRESSforyouhttp://picasaweb.google.it/fashionDRESSforyou5 CasualWear: http://picasaweb.google.it/Casualwearforyou Accessory: http://picasaweb.google.it/ladiesfashionforyou2 http://picasaweb.google.it/ladiesfashionforyou http://picasaweb.google.it/fashionaccessoryforyouhttp://picasaweb.google.it/fashionaccessorforyou Leather and Fur : http://picasaweb.google.it/leathernfurforyou *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Drop-down menu issues
On Jul 29, 2011, at 7:59 AM, Nancy Johnson wrote: -snip- If so could someone point me to an easy tutorial with more examples than lots of text.? Thanks, Nancy Nancy: I have a couple menus you might try: http://sperling.com/web-tips.php Cheers, tedd ___ Tedd Sperling tedd.sperl...@gmail.com http://sperling.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] a:link behaviors issues
Mathew is asking the pertinent question.
There are five pseudo selectors to consider on links:
:link
:visited
:focus
:hover
:active
By applying the font attributes to link and visited you leave the others
undefined. You could apply the attributes to all states, although the more
efficient solution is to only use pseudo selectors to apply attributes you wish
to differ between these states, anything else ought to be set to the element or
inherited from a parent.
.navbar {
font: ...
}
.navbar a {
text-decoration: none; /* applied to all link states */
}
.navbar a:link {
color: blue;
}
.navbar a:visited {
color: purple;
}
Hope that helps.
Ollie
--
@ollicle
On 28/07/2011, at 8:51 AM, Mathew Robertson mathew.blair.robert...@gmail.com
wrote:
This is going to sound like an odd question, but have you also applied this
style to the non-psuedo-selector (ie just 'a')?
regards,
Mathew Robertson
On 28 July 2011 08:42, olivia antonin olivianto...@hotmail.com wrote:
Hi ,
I don't understand, my navigation bar, on my mac they behave as I want, so
that the font size remain the same , as well as when visited.
a:link, a:visited{
font: 13px Myriad pro, Lucida Grande, Calibri, sans-serif;
color:#686868;
text-decoration: none;
}
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] a:link behaviors issues
On 29 Jul 2011, at 14:14, Oliver Boermans wrote: Mathew is asking the pertinent question. There are five pseudo selectors to consider on links: :link :visited :focus :hover :active By applying the font attributes to link and visited you leave the others undefined. A link doesn't stop being a link just because it is a hovered, focused or active link. :link and :visited are mutually exclusive (since :link means unvisited link) but the other pseudo-classes stack (with them and each other). The only time you need to worry about focus/hover/active applying when link/visited don't is when you have a non-linked anchor (which you shouldn't have these days since `id` on a heading or div/section/etc makes more sense). -- David Dorward http://dorward.me.uk *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Drop-down menu issues
On Jul 29, 2011, at 4:59 AM, Nancy Johnson wrote: Other issues have come up non-508 and it was extremely challenging to style each level with and without a link. Then I discovered Superfish and wanted to upgrade the technology, however it won't work for keyboard only users without a link. Question... Is it appropiate to use a href=# or any other means to indicate no link? there is no onclick event straight html. Is there something else? I think you are confusing with the link (because of drop-down menu?), content and keyboard navigation. 1. Keyboard navigation allows a user to tab through links within a page. If a section of content consists of links and content, it simply looks for the next link. It couldn't magically provide tab-able navigation within the content if there is no herf link whether the content is in a drop-down menu (or similar effect) or not. 2. If a phrase, a sentence of paragraph or a li element is not a link (to somewhere) and it's not used to trigger a JS effect within the page (such as tab, accordion, collapsable, or popup), you should never use a href=#. 3. A drop-down menu is a conventional set of navigational elements that group together within a section using show/hide sort of effect. Maybe you can still call it drop-down menu if it's a mixed of navigational elements and content, but IMHO the name doesn't matter because it boils down to this: using JS effect to control a section of the page that has both navigational elements and content. What matters is how you go about doing it right that doesn't add obstacle for the users, and for an effect like this, you probably don't want to use suckerfish or superfish or any drop-down menu script but something simple that controls the show/hide, then use absolute position to control the hidden div so when it triggers (either by hover or click or keyboard tab), it mimics a drop-down effect instead of collapsable. Google jQuery show hide you should be able to find plenty examples. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
[WSG] hiding time in the browser
hi. is there a vb behind code file that you know of where i can find, so it hides the time, in my browser. for my visualf web developer project? thanks Marvin. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
