508 and onclick events

[Nedals]

My customer wants his site updated to be 508 complient but I ran into a minor problem. The site has a couple of popups that use the onclick event.

ie: <a href="somepage.html" onclick="return popup(this.href,......)">

'Bobby' states the events MUST have a keyboard equivalant.

ie: onkeypress="return popup(this.href,......)"

So I added the onkeypess and the page passed, but the onkeypress doesn't seem to work?.
Surely there must be a better way??

[Vladdy]

Yeah, do not use popups....

[JavaHead Jonnie]

I'm not too sure, but:
onkeypress="this.onclick()"

[crh3675]

Just do this instead:

<a href="somepage.html" onclick="return popup(this.href,'win','args');return false" target="_blank">

Which will cause "somepage.html" to open in a separate window if Javascript is disabled

[David Harrison]

Originally posted by crh3675
Just do this instead:

<a href="somepage.html" onclick="return popup(this.href,'win','args');return false" target="_blank">

Which will cause "somepage.html" to open in a separate window if Javascript is disabled Yeah because that makes it a lot more accessible, now everyone can have a pop-up and a broken browser back button. (We need a sarcastic looking smiley for occasions such as this.)

You have to seriously ask yourself "does this link need to pop-up in a new window?" if the answer is yes then your current code will do just fine but if the answer is no just make a normal link.
By using this.href and return false you are catering for non-JavaScript browsers because the link would behave as nomal for them.

You should also be aware of pop-up blockers though, if the window.open command is not actually inside the onlick event itself then the pop-up will be blocked, therefore will need to move just the window.open part of the code from the function and put it into the link.

[toicontien]

You might be interested in this article at A List Apart: Accessible Pop-up Links (http://www.alistapart.com/articles/popuplinks/)

I've implemented this on the new stock newspaper Web site templates I've created for my job.

[Nedals]

Thank you for that link. :)

After exploring some of the comments, I ended up here....
http://www.quirksmode.org/js/popup.html#link7.

Toward the end of the artical, 'Custom attributes', there's an interesting way to create
popups that does not get flagged as an error by 'Bobby'


var popup = null;
function thepopup(url) {
if (popup && !popup.closed) { popup.close() }
popup = window.open(url,"popup","width=650,height=450,menubar,scrollbars,resizable");
popup.focus();
return false;
}

function get_anchors() {
var anchors = document.getElementsByTagName('a');
for (var i=0; i<anchors.length; i++) {
if (anchors[i].getAttribute('type') == 'popup') {
anchors[i].onclick = function(){ return thepopup(this.href) }
}
}
}
window.onload = get_anchors;

In HTML....
<a href="link.html" title="This link opens a popup." type="popup">Link Text</a>

[Webnauts]

You might would like to have a look at my example work, which will definetely help you with your problem: http://www.webnauts.net/popup.html