Re: [WSG] Opening external links in popup windows with no extra markup
On 8/2/05, Ben Curtis [EMAIL PROTECTED] wrote:
Good catch. Now we're talking a good excuse for regular expressions.
Instead of my recommendation of:
a[i].getAttribute('href').toUpperCase().indexOf(HTTP://) == 0
...I now recommend:
/^https?:\/\//i.test(a[i].getAttribute('href'))
Talk about technology for technology's sake! At least you admitted it
(good _excuse_ for regular expressions ;)
RegExp() is one of the top three resource hungry javascript functions
to avoid. The other two biggies being eval( ) and setInterval. ( JS
Gurus: please feel free to correct me on that one if you believe
otherwise! )
I once had a reference sheet with all the js string manipulation
methods in order of their speed; if I could find it you'd be clicking
a link about now...
I'd use this:
if ( a[i].getAttribute('href').indexOf(://) -1 ) {
//do stuff
}
Cheers,
Andrew.
http://leftjustified.net/
**
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] Opening external links in popup windows with no extra markup
On Jul 29, 2005, at 5:53 PM, Andrew Krespanis wrote:
On 7/30/05, Thierry Koblentz [EMAIL PROTECTED] wrote:
I think you ought to check specifically that 'http://' is at the
beginning of the string.
Good point, I'll change this.
A more reusable approach would be to check for '://', as this is what
differentiates 'mailto:', relative paths and 'http://' links, but will
still allow you to use the script on secure pages.
Whenever dealing with href maniputlation, it's always good to keep
'https' in the back of your mind ;)
Good catch. Now we're talking a good excuse for regular expressions.
Instead of my recommendation of:
a[i].getAttribute('href').toUpperCase().indexOf(HTTP://) == 0
...I now recommend:
/^https?:\/\//i.test(a[i].getAttribute('href'))
(tested only in Firefox, Safari; pretty sure it's good but I'm not
familiar with IE regexp quirks)
--
Ben Curtis : webwright
bivia : a personal web studio
http://www.bivia.com
v: (818) 507-6613
**
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] Opening external links in popup windows with no extra markup
In a controlled input situation (eg: a web developer's blog), a solution like Patrick Lauke's 'type' link styling expermient ( http://www.splintered.co.uk/experiments/38/ ) adds more useful info to the markup and can be used the same way; but when a client is in control of the content you set up whatever automated help you can and cross your fingers ;D The client factor highlights why inobtrusive/separated Javascript is the way to go... things have a chance so long as the user doesn't have to do anything extra, much less have to *consistently* do something extra. If we don't have to teach them anything, they can't get it wrong and we avoid offending the academic/client ego ;) h -- --- http://www.200ok.com.au/ --- The future has arrived; it's just not --- evenly distributed. - William Gibson ** 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] Opening external links in popup windows with no extra markup
Andrew Krespanis wrote: The problem was that we wanted to handle links to non-html files in a different manner than regular links. Ideally, it shouldn't require any more effort from the content author. The following page shows a simple demonstration of the solution: http://leftjustified.net/lab/javascript-file-links/ Nice! Thanks for sharing... Thierry | www.TJKDesign.com ** 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] Opening external links in popup windows with no extra markup
Thierry Koblentz wrote:
Hi all,
I'd appreciate your feedback about this technique that does not rely on
hooks; it only uses the href attribute...
http://www.tjkdesign.com/articles/popups.asp
Looks good Thierry.
One thing though-- what happens to mailto: links?
i know in an *old* switcher i had:
if(href.indexOf(mydomain.com) == -1){ // Href is not a file on my server
if(href.indexOf(javascript:) == -1){ // Href is not a
javascript call
if(!anchors[i].onclick){ // Href does not have
an onclick event
if(href.indexOf(mailto:;) == -1){ //
Href is not a mailto:
if(href.indexOf(http://;) != -1){ // Href is not relative (for
Safari)
anchors[i].setAttribute(target,_blank);
}
}
}
}
}
I found the the mail and safari links got all weird.
perhaps this is something to look into or test if you haven't already.
**
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] Opening external links in popup windows with no extra markup
Hi Brian, Looks good Thierry. Thanks One thing though-- what happens to mailto: links? Good point! To be honnest with you I didn't even think about these :) But they are safe because I'm checking for an HTTP string inside the attribute's value. I think this method could be used to style mailto: links as well, to let the user knows that clicking on them will open another app... Thierry | www.TJKDesign.com ** 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] Opening external links in popup windows with no extra markup
On Jul 29, 2005, at 12:43 PM, Thierry Koblentz wrote:
One thing though-- what happens to mailto: links?
Good point! To be honnest with you I didn't even think about these :)
But they are safe because I'm checking for an HTTP string
inside the
attribute's value.
I think you ought to check specifically that 'http://' is at the
beginning of the string. This would help rule out false positives
like these:
a href=/protocols/about_http.htmlFind out about HTTP/a
a href=/affiliate.asp?ref=http://foo.com/bar.php;Set your
affiliation reference cookie/a
In your code you have:
a[i].getAttribute('href').toUpperCase().indexOf(HTTP) = 0
...and I think you might be better with:
a[i].getAttribute('href').toUpperCase().indexOf(HTTP://) == 0
And other than the design choice of whether all external links ought
to open a new window, I think you've got something good. I like your
idea of attaching the style and title with javascript so as to leave
the natural behavior intact.
Personally, I prefer the rel attribute, because when done well you
are expressing the arbitrary relationship the current document has to
the target document. If you only use rel to basically say open a new
window then that's not very semantic and it's coupling markup and
behavior closely. But if you use rel to say some links are for other
content, others are for examples and figures, and either can be
external sites, and then use JS to set examples and figures on
external sites to open in new windows, then you're golden. Your rel
is meaningful and your behavior is attached to the meaning of the
markup.
--
Ben Curtis : webwright
bivia : a personal web studio
http://www.bivia.com
v: (818) 507-6613
**
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] Opening external links in popup windows with no extra markup
I think you ought to check specifically that 'http://' is at the beginning of the string. Good point, I'll change this. a href=/protocols/about_http.htmlFind out about HTTP/a a href=/affiliate.asp?ref=http://foo.com/bar.php;Set your affiliation reference cookie/a And other than the design choice of whether all external links ought to open a new window, I think you've got something good. I like your idea of attaching the style and title with javascript so as to leave the natural behavior intact. Thanks, but don't give me credit for that :) The only thing I claim here is the use of the href attribute as the only element to use to determine on which links behavior and style should be attached (external links, files inside a specific folder, links inside a specific element...). Thanks for your feedback and suggestion, Thierry | www.TJKDesign.com ** 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] Opening external links in popup windows with no extra markup
I use a little javascript to make open pop up link and this is Valid
XHTML Strict!.
I know maybe there are many master here, and i just share my little knowledge.
Below this code and example :
1. create javascript code and save as .js file
--
function externalLinks() {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName(a);
for (var i=0; ianchors.length; i++) {
var anchor = anchors[i];
if (anchor.getAttribute(href)
anchor.getAttribute(rel) == external)
anchor.target = _blank;
}
}
window.onload = externalLinks;
2. call that js into the page
script type=text/javascript src=js/blank.js/script
3. change for target=_blank into rel==external on link tag a href
this work on ie, firefox, NS, opera etc.
For online sample visit http://www.rayofshadow.or.id/pop.htm
thanks
Ray | http://www.rayofshadow.or.id
*i was send with wrong email*
On 7/30/05, Brian Cummiskey [EMAIL PROTECTED] wrote:
Thierry Koblentz wrote:
Hi all,
I'd appreciate your feedback about this technique that does not rely on
hooks; it only uses the href attribute...
http://www.tjkdesign.com/articles/popups.asp
Looks good Thierry.
One thing though-- what happens to mailto: links?
i know in an *old* switcher i had:
if(href.indexOf(mydomain.com) == -1){ // Href is not a file on my server
if(href.indexOf(javascript:) == -1){ // Href is not
a javascript call
if(!anchors[i].onclick){ // Href does not have
an onclick event
if(href.indexOf(mailto:;) == -1){ //
Href is not a mailto:
if(href.indexOf(http://;) !=
-1){ // Href is not relative (for
Safari)
anchors[i].setAttribute(target,_blank);
}
}
}
}
}
I found the the mail and safari links got all weird.
perhaps this is something to look into or test if you haven't already.
**
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] Opening external links in popup windows with no extra markup
On 7/30/05, Thierry Koblentz [EMAIL PROTECTED] wrote: I think you ought to check specifically that 'http://' is at the beginning of the string. Good point, I'll change this. A more reusable approach would be to check for '://', as this is what differentiates 'mailto:', relative paths and 'http://' links, but will still allow you to use the script on secure pages. Whenever dealing with href maniputlation, it's always good to keep 'https' in the back of your mind ;) Other than that, it looks like a great approach for sites with client controlled content. Sure beats trying to teach them to include a different class or rel attrib on external links! Andrew. http://leftjustified.net/ ** 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] Opening external links in popup windows with no extra markup
A more reusable approach would be to check for '://', as this is what differentiates 'mailto:', relative paths and 'http://' links, but will still allow you to use the script on secure pages. Whenever dealing with href maniputlation, it's always good to keep 'https' in the back of your mind ;) Nice catch! Other than that, it looks like a great approach for sites with client controlled content. Thanks Andrew, Thierry | www.TJKDesign.com ** 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] Opening external links in popup windows with no extra markup
Something similar to this came up at work last week and I think it would be good to tack it on to this thread (hopefully there's enough relevance!). The problem was that we wanted to handle links to non-html files in a different manner than regular links. Ideally, it shouldn't require any more effort from the content author. The following page shows a simple demonstration of the solution: http://leftjustified.net/lab/javascript-file-links/ By splitting it into a switch/case, you can have different behaviour/style/etc for each file type. A good example might be redirecting all mp3 links via a site's Flash audio widget if Flash (and js) are present. Another useful addition would be to check if the link is the sole child element of an li, in which case you may want a large icon to the left (see demo page) or if it's the child of a paragraph, you may want a smaller icon on the right... All without the author even considering that they are linking to a file that could potentially load external apps/plugins. In a controlled input situation (eg: a web developer's blog), a solution like Patrick Lauke's 'type' link styling expermient ( http://www.splintered.co.uk/experiments/38/ ) adds more useful info to the markup and can be used the same way; but when a client is in control of the content you set up whatever automated help you can and cross your fingers ;D Cheers, Andrew. On 7/30/05, Thierry Koblentz [EMAIL PROTECTED] wrote: A more reusable approach would be to check for '://', as this is what differentiates 'mailto:', relative paths and 'http://' links, but will still allow you to use the script on secure pages. Whenever dealing with href maniputlation, it's always good to keep 'https' in the back of your mind ;) Nice catch! Other than that, it looks like a great approach for sites with client controlled content. Thanks Andrew, Thierry | www.TJKDesign.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** -- http://leftjustified.net/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
