Why does #4 create a new regular expression object on every iteration of the loop? That’d be pretty slow, as it’d have to parse the regexp on every iteration. I think it’d be significantly faster to create one RegExp, before the loop starts.
This is great, but I\m new to jquery – so how do you use this code? I assume it goes int he head somewhere, and then have a css style for ‘external’ – but does it need script tags etc?
Can you use this CSS technique to insert this:
target=”_blank”
into the href tag? I want to find all external links on a page and open them in a separate window, not style them.
With pure CSS you can achieve this by setting all links to have the external treatment and using the cascade w/ attribute selectors to target and unset your exclusions. This technique probably won’t work on all browsers (*ahem* oldIE), but it’s handy when you don’t have complete control over how your markup is created—like in a CMS with inconsistant modules/plugins that write markup—where you have a mix of absolute and relative links and no way to apply an class="external", rel="external", target="_blank", etc. and you don’t want to rely on JavaScript.
/* target all anchors with an href attribute */
a[href] {
display: inline-block;
}
/* do something special to indicate an external link */
a[href]:after {
content: ">";
}
/* target what you consider to be "internal" links and undo styles */
a[href*="your.domain.com"],
a[href^="/"],
a[href^="#"],
a[href^="mailto:"],
a[href^="javascript:"] {
display: inline;
}
/* undo */
a[href*="your.domain.com"]:after,
a[href^="/"]:after,
a[href^="#"]:after,
a[href^="mailto:"]:after,
a[href^="javascript:"]:after {
content: none;
}
I am trying to open rss feed on my website to open in new tab but its not working ,I have trying everything ,please help me.i think this script is preventing that to happen.i m new to this.can u please tell me what I need to change in this to external link to open in new tab.
$(document).ready(function() {
function filterPath(string) {
return string
.replace(/^\//,”)
.replace(/(index|default).[a-zA-Z]{3,4}$…
.replace(/\/$/,”);
}
var locationPath = filterPath(location.pathname);
var scrollElem = scrollableElement(‘html’, ‘body’);
// use the first element that is “scrollable”
function scrollableElement(els) {
for (var i = 0, argLength = arguments.length; i <argLength; i++) {
var el = arguments[i],
$scrollElement = $(el);
if ($scrollElement.scrollTop()> 0) {
return el;
} else {
$scrollElement.scrollTop(1);
var isScrollable = $scrollElement.scrollTop()> 0;
$scrollElement.scrollTop(0);
if (isScrollable) {
return el;
}
}
}
return [];
}
Reference URL no longer works.
I guess the author took it down… sorry about that. I removed that link and added an additional technique.
Any info on which of these is optimal for performance? (I’m guessing not #4 heheh)
I actually have no idea, that would be good to know.
Why does #4 create a new regular expression object on every iteration of the loop? That’d be pretty slow, as it’d have to parse the regexp on every iteration. I think it’d be significantly faster to create one RegExp, before the loop starts.
This is great, but I\m new to jquery – so how do you use this code? I assume it goes int he head somewhere, and then have a css style for ‘external’ – but does it need script tags etc?
Do it with CSS:
a[href^="http://"]{ /*Style an external link here*/ }
Nice – but this wouldn’t work if you have a CMS system that uses absolute urls (I think WordPress does this?)
Can you use this CSS technique to insert this:
target=”_blank”
into the href tag? I want to find all external links on a page and open them in a separate window, not style them.
Just in case any one comes across this like I did, and wants a CSS only alternative, this is what I used:
a[href*="//"]:after {content: ">"}It is mainly for relative links only, or else your own links will get the
content:">"why not use document.domain rather than manually typing in the domain?
@Rory – You can do it that way :)
a[target="_blank"] { yourstyle: style !important; }
Hello frds!!
I have two question here.
first one is how i can prevent default selection of radio button.
second one is that how i can open new window in parent window of the current. I have use code like
window.open(‘mypage.html’ , ‘_parent’)
what is prob with this code??????
Help me plzzzzzzzz
With pure CSS you can achieve this by setting all links to have the external treatment and using the cascade w/ attribute selectors to target and unset your exclusions. This technique probably won’t work on all browsers (*ahem* oldIE), but it’s handy when you don’t have complete control over how your markup is created—like in a CMS with inconsistant modules/plugins that write markup—where you have a mix of absolute and relative links and no way to apply an
class="external",rel="external",target="_blank", etc. and you don’t want to rely on JavaScript.I am trying to open rss feed on my website to open in new tab but its not working ,I have trying everything ,please help me.i think this script is preventing that to happen.i m new to this.can u please tell me what I need to change in this to external link to open in new tab.
$(document).ready(function() {
function filterPath(string) {
return string
.replace(/^\//,”)
.replace(/(index|default).[a-zA-Z]{3,4}$…
.replace(/\/$/,”);
}
var locationPath = filterPath(location.pathname);
var scrollElem = scrollableElement(‘html’, ‘body’);
$(‘a[href*=#]‘).each(function() {
var thisPath = filterPath(this.pathname) || locationPath;
if ( locationPath == thisPath
&& (location.hostname == this.hostname || !this.hostname)
&& this.hash.replace(/#/,”) ) {
var $target = $(this.hash), target = this.hash;
if (target) {
var targetOffset = $target.offset().top;
$(this).click(function(event) {
event.preventDefault();
$(scrollElem).animate({scrollTop: targetOffset}, 400, function() {
location.hash = target;
});
});
}
}
});
// use the first element that is “scrollable”
function scrollableElement(els) {
for (var i = 0, argLength = arguments.length; i <argLength; i++) {
var el = arguments[i],
$scrollElement = $(el);
if ($scrollElement.scrollTop()> 0) {
return el;
} else {
$scrollElement.scrollTop(1);
var isScrollable = $scrollElement.scrollTop()> 0;
$scrollElement.scrollTop(0);
if (isScrollable) {
return el;
}
}
}
return [];
}
});