[WSG] Creating Nice Pop-Ups
Hey list, Right im using the good old methord of nice pop-ups as shown by by idol youngpup (http://youngpup.net/2003/popups) now as soon as you use onClick in your HTML WebXACT and Bobby throw up a fit saying that it does not pass AA thanks to 9.3 Make sure event handlers do not require use of a mouse. Which my links dont require, now what im wanting to know is there away to call onClick form a external JS and then apply it through another function? Allowing us to have Accessible Pop-ups? Ive got one idea of scanning links and replacing them on the fly with JS which im going to try in a second but i thought id just rattle all you brainheads on the list. dunno if you would class a accessible issuse worth use of the list, but if not im sorry. Thanks anyways Mark Harwood Phunky.co.uk / Zinkmedia.co.uk / Xhtmlandcss.co.uk - Currently looking for work ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Creating Nice Pop-Ups
Its ok ive figured it out for my self, please someone give me the lists dunse hat please! all you need for nice popups are... href=http://www.phunky.co.uk/; onclick=window.open(this.href); return false; onkeypress=window.open(this.href); return false; Thanks anyways Mark Harwood Phunky.co.uk / Zinkmedia.co.uk / Xhtmlandcss.co.uk - Currently looking for work On Wed, 10 Nov 2004 10:25 , Mark Harwood WebMail [EMAIL PROTECTED] sent: Hey list, Right im using the good old methord of nice pop-ups as shown by by idol youngpup (http://youngpup.net/2003/popups\) now as soon as you use onClick in your HTML WebXACT and Bobby throw up a fit saying that it does not pass AA thanks to 9.3 Make sure event handlers do not require use of a mouse. Which my links dont require, now what im wanting to know is there away to call onClick form a external JS and then apply it through another function? Allowing us to have Accessible Pop-ups? Ive got one idea of scanning links and replacing them on the fly with JS which im going to try in a second but i thought id just rattle all you brainheads on the list. dunno if you would class a accessible issuse worth use of the list, but if not im sorry. Thanks anyways Mark Harwood Phunky.co.uk / Zinkmedia.co.uk / Xhtmlandcss.co.uk - Currently looking for work The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Creating Nice Pop-Ups
Mark Harwood wrote:
Hey list,
Right im using the good old methord of nice pop-ups as shown by
by idol youngpup (http://youngpup.net/2003/popups) now as soon
as you use onClick in your HTML WebXACT and Bobby throw up a fit
saying that it does not pass AA thanks to 9.3 Make sure event
handlers do not require use of a mouse.
Now that is why I don't like these automated 'get yourself a Johnny
Accessibility approval' sites. I can't see what is wrong with extending
the plain href= with an extra feature for able UA's with 'onclick'.
Just make sure you get the thing to fall back gracefully.
Which my links dont require, now what im wanting to know is there away
to call onClick form a external JS and then apply it through another
function? Allowing us to have Accessible Pop-ups?
An excellent article on ALA covers just this:
http://www.alistapart.com/articles/popuplinks/
It is a bit complicated, as it uses the long route to connect a function
to an event bubbling through the DOM, but it covers the things you describe.
I've written a smaller, dedicated piece of script to add popup behaviour
to links. It's not as elegant as Caio Chassot's solution, but still:
// Start when XHTML document is loaded completely...
//
window.onload = function() {
if (document.getElementsByTagName)
{
var allLinks = document.getElementsByTagName('a');
// Loop through all hyperlinks in the document.
//
for (var i = 0; i allLinks.length; i++)
{
switch (allLinks[i].className)
{
case 'popup':
// Define onclick event for this hyperlink.
allLinks[i].onclick = function ()
{
// Fetch ID for this link.
var thisPopupVars = this.id.toString();
// Fetch params from id attribute.
var thisPopupWidth = thisPopupVars.substring(1,4);
var thisPopupHeight = thisPopupVars.substring(4,7);
var thisPopupScroll = thisPopupVars.substring(7,8);
var thisPopupName =
thisPopupVars.substring(8,(thisPopupVars.length));
// Fetch URL from href attribute.
var thisPopupURL = this.href;
// Prepare string for popup.
var thisPopupParams = 'width='
+ thisPopupWidth + ',height='
+ thisPopupHeight + ',location=1,menubar=1,scrollbars='
+ thisPopupScroll + ',status=1,toolbar=1,resizable=1';
// Check if a popup already exists and close that popup.
if (popupWin) { popupWin.close(); }
// Open the popup with the defined parameters URL.
var popupWin =
window.open(thisPopupURL,thisPopupName,thisPopupParams);
// Prevent the event from bubbling on.
return false;
}
break; // End of first-and-only case in this switch.
} // End of switch.
}
}
If you include the above script through an external .js file or in the
head, you can use an XHTML syntax such as:
a href=http://www.google.com/;
class=popup
id=x4003001GoogleGoogle/a
With the ID attribute you set some params for the popup:
x - ids should start with [a-zA-Z], useful to make multiple
links with the same params (e.g.: 'y4003001Google').
This first letter is neglected by the routine.
400- Width of the popup (100-999).
300- Height of the popup (100-999).
1 - Toggle for scrollbars: 1=yes, 0=no.
Google - Name of the popup window; no spaces I guess.
Maybe you'll find this useful. I have taken this from a larger routine,
so the warranty ends at the front door. ;-)
Good luck,
Jeroen
--
vizi fotografie grafisch ontwerp - http://www.vizi.nl/
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
RE: [WSG] Creating Nice Pop-Ups
From: Jeroen Visser [ vizi ] Mark Harwood wrote: Hey list, Right im using the good old methord of nice pop-ups as shown by by idol youngpup (http://youngpup.net/2003/popups) now as soon as you use onClick in your HTML WebXACT and Bobby throw up a fit saying that it does not pass AA thanks to 9.3 Make sure event handlers do not require use of a mouse. Now that is why I don't like these automated 'get yourself a Johnny Accessibility approval' sites. I can't see what is wrong with extending the plain href= with an extra feature for able UA's with 'onclick'. Just make sure you get the thing to fall back gracefully. Incidentally, I've discussed this before, but...onclick is implemented in practically all current browsers as a non-device-specific event, as it is triggered by keyboard access as well (on elements that can receive focus via keyboard tabbing, anyway, i.e. links and form elements). So, for the most part, those Blobby and WebXCACK errors are irrelevant for modern browsers, and - if there is indeed a graceful fallback option - completely pointless. Patrick Patrick H. Lauke Webmaster / University of Salford http://www.salford.ac.uk ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
RE: [WSG] Creating Nice Pop-Ups
On Wednesday, November 10, 2004 6:47 AM, Patrick Lauke wrote: Incidentally, I've discussed this before, but...onclick is implemented in practically all current browsers as a non-device-specific event, as it is triggered by keyboard access as well (on elements that can receive focus via keyboard tabbing, anyway, i.e. links and form elements). Patrick is, as usual, bang on with this. Further - unless it is done very carefully, onkeypress redundancy makes keyboard navigation next to impossible in various browsers. In many cases it causes unintended consequences - like not allowing one to tab to the next link, causing popups to occur, or changing stylesheets without the user really wanting to change stylesheets. Best regards, Derek. -- Derek Featherstone [EMAIL PROTECTED] phone: 613.599.9784; toll-free: 1.866.932.4878 (North America) Web Accessibility: http://www.wats.ca Personal: http://www.boxofchocolates.ca ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
