TabIndex in FireFox

[srk]

Hi!

I am trying to add Keyboard Navigation to my Menus.
Each menu item is built doing the following:

var Item = document.createElement('DIV');
Item.tabIndex=500;

By adding the above, I am able to tab to each menu Item in IE.
But in FireFox nothing happens. Is there anything special that I need to do
for FireFox?

Also, I would like to add accessKey to my menuitem and underline the accesskey character. Is it possible to do that?


Thanks for all the help.



srk

[premii]

Yes it is possible to highlight accesskey using DOM.

Create a new SPAN node with accesskey, and replace the accesskey character in text,

heres code
NOTE: i didn't write this.
---------------------

function underline() {
var nav = document.getElementById('mymenu');
var navlinks = nav.getElementsByTagName('A');
for (var i = 0; i < navlinks.length; i++) {
var accesskey = navlinks[i].getAttribute('accesskey');
if (accesskey) {
var link = navlinks[i];
var linktext = link.childNodes[0].nodeValue;
var keypos = linktext.indexOf(accesskey);
var firstportion = linktext.substring(0,keypos);
var keyportion = linktext.substring(keypos,keypos+1);
var lastportion = linktext.substring(keypos+1,linktext.length);

link.childNodes[0].nodeValue = firstportion;
var s = document.createElement("span");
var span = link.appendChild(s);
var keyt = document.createTextNode(keyportion);
span.appendChild(keyt);
var lastt = document.createTextNode(lastportion);
link.appendChild(lastt);
}
}
}

[srk]

Thankyou premii!

I actually was able to underline the acesskey of the Menu Text by doing the following:

function GoPage(){
dothis();
dothat();
}

var Item = document.createElement('DIV');
Item.tabIndex=500;
Item.disptext = "Menu1";
Item.accessKey = "M";
Item.onclick = GoPage;
var pos = Item.dispText.indexOf(Item.accessKey);
Item.innerHTML = Item.dispText.substring(0,pos) + '<u>' + Item.dispText.charAt(pos) + '<\/u>' +Item.dispText.substring(pos+1) ;


Now I am able to do Alt+M to go to the Menu Item-- Menu1; the focus goes there, but I need to hit enter to actually execute the login inside GoPage();
Is there anyway to execute the logic without hitting Enter?

Also, does anybody have any feedback on why tabIndex is not working in FireFox?


Thank you,
srk

[Harry Armadillo]

tabindex in not a valid attribute for div tags.

Use an onfocus handler to elimate the need for enter.

[srk]

http://www.mozilla.org/access/keyboard/tabindex.html

states that tabindex is supported for <DIV> and <SPAN>.
But I was not able to tab through the menus on their sample page.

I really need to get this tabindex thing working for Menus in FireFox.

Thankyou,
srk

[Harry Armadillo]

That says they are planning to extend tabindex functionality beyond the w3c standards. It does not imply div and span currently support tabindex.

Even when the additional tabindex support is available, it will take time for people to upgrade to newer versions. If you want keyboard support in Firefox, script it yourself or make use of the classical <a>.

[brothercake]

That functionality is dubious anyway - I would strongly advise you not use it, but use anchors or form elements as focus handlers throughout.

[srk]

Thanks for all the suggestions. Since, I don't have much time I was thinking to leave <DIV> for my menus and atleast use accesskeys so the users will be able to access the menu using Alt+accesskey. That way I can make my menus partially keyboard navigable. IE works fine but FireFox does nothing when I do Alt+ accesskey. Please Help!!!!


Thank you,
srk