21305 Posts in 5736 Topics by 2603 members
|
Page:
1
|
Go to End | |
| Author | Topic: | 1644 Views |
-
Anyone know jQuery?

25 June 2009 at 9:01pm
I'm trying to get a link to open in a new window, I have the following jQuery so that the whole div is clickable.
$(document).ready(function(){
$(".promoBox.anchor").click(function() {
window.location=$(this).find("a").attr("href");return false;
});$('.promoBox.anchor').hover(function() {
$(this).addClass('boxHover');
}, function() {
$(this).removeClass('boxHover');
});});
If I add "_blank" to the link in the HTML it does not open in a new window, I know this is a limitation. I can add a line in the jQuery to tell it to add an attribute to overcome this but this is not working with what I have above. If I use Firebug I can clearly see that the "_blank" is appended to the anchor though.
$(".external a").attr('target', '_blank').attr('title','This link will open in a new window.');
So with the code above I tried:
$(document).ready(function(){
$(".external a").attr('target', '_blank').attr('title','This link will open in a new window.');
$(".promoBox.anchor").click(function() {
window.location=$(this).find("a").attr("href");return false;
});$('.promoBox.anchor').hover(function() {
$(this).addClass('boxHover');
}, function() {
$(this).removeClass('boxHover');
});});
My html div looks like this:
<div class="promoBox anchor external">
<div class="inner">
<h2>Advert Box</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<p><a href="http://www.google.co.uk">Read more</a></p>
</div>
</div>And in Firebug:
<div class="promoBox anchor external">
<div class="inner">
<h2>Advert Box</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<p><a href="http://www.google.co.uk" target="_blank" title="This link will open in a new window.">Read more</a></p>
</div>
</div>So can anyone help?
-
Re: Anyone know jQuery?

25 June 2009 at 11:14pm
Try the following:
Instead of:window.location=$(this).find("a").attr("href");return false;
Write:
$(this).find("a").trigger("click");
-
Re: Anyone know jQuery?

25 June 2009 at 11:43pm
Just tried that, it works so long as you click on the actual anchor "Read more". If you click anywhere within the div nothing happens.
-
Re: Anyone know jQuery?

25 June 2009 at 11:54pm
Hm yeah. This will only trigger events that are bound via jQuery and not the default click. You could try this instead:
window.open($(this).find('a').attr('href')); return false;
-
Re: Anyone know jQuery?

26 June 2009 at 12:00am
Almost there.. maybe?
I tried:
$(document).ready(function(){
$(".promoBox.anchor").click(function() {
window.open($(this).find('a').attr('href')); return false;
});$('.promoBox.anchor').hover(function() {
$(this).addClass('boxHover');
}, function() {
$(this).removeClass('boxHover');
});});
This opens all links in a new window. I'd like to be able to either add in "_blank" or a class as not all links need to open in a new window.
-
Re: Anyone know jQuery?

26 June 2009 at 12:06am
Actually the code above will open the link in the new window and in the current window.
-
Re: Anyone know jQuery?

26 June 2009 at 1:03am
This function should consider the "target" attribute correctly:
$(document).ready(function(){
$(".promoBox.anchor").click(function(evt) {
evt.preventDefault();
var a = $(this).find('a');
var tgt = a.attr('target');
window.open(a.attr('href'), (tgt == undefined ||Â tgt == '') ? '_self' : tgt);
return false;
});
$('.promoBox.anchor').hover(function() {
$(this).addClass('boxHover');
}, function() {
$(this).removeClass('boxHover');
});
}); -
Re: Anyone know jQuery?

26 June 2009 at 1:11am
I now have it working with the following code:
$(document).ready(function(){
$(".promoBox.anchor").click(function() {
window.location=$(this).find("a").attr("href");return false;
});$(".promoBox.anchorexternal").click(function() {
strUrl=$(this).find("a").attr("href");
window.open(strUrl);return false;
});$('.promoBox.anchor').hover(function() {
$(this).addClass('boxHover');
}, function() {
$(this).removeClass('boxHover');
});$('.promoBox.anchorexternal').hover(function() {
$(this).addClass('boxHover');
}, function() {
$(this).removeClass('boxHover');
});});
| 1644 Views | ||
|
Page:
1
|
Go to Top |


