www.webdeveloper.com
Results 1 to 8 of 8

Thread: 508 and onclick events

  1. #1
    Join Date
    Dec 2002
    Location
    Pleasanton, CA
    Posts
    2,132

    508 and onclick events

    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??

  2. #2
    Join Date
    Nov 2002
    Location
    Nashua, NH
    Posts
    3,195
    Yeah, do not use popups....

  3. #3
    Join Date
    Nov 2003
    Location
    Cyberspace, last time I checked.
    Posts
    166
    I'm not too sure, but:
    Code:
    onkeypress="this.onclick()"

  4. #4
    Join Date
    Jan 2004
    Location
    Washington DC
    Posts
    1,107
    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

  5. #5
    Join Date
    Dec 2002
    Location
    Manchester, UK
    Posts
    6,276
    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.
    Every fight is a food fight when you’re a cannibal.

  6. #6
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,774

  7. #7
    Join Date
    Dec 2002
    Location
    Pleasanton, CA
    Posts
    2,132
    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'

    Code:
    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>

  8. #8
    Join Date
    Nov 2003
    Location
    Germany, Europe
    Posts
    100
    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

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles