Remonter un lien dans la div englobante mais garder les autres (jQ)

<div class=" englobe">
<div class="services_block_text grid_14" >
    Bla bla bla   
   <p><a href="[#darkblue]LIEN1[/#]">Page  à voir</a> sur le site de l'éditeur.</p>
</div>
<div class="cadre_image" style="">
   <img src="/img/curseur.png"  width="96px" height="99px" alt="" title=""/>
</div>
<div id="truc"><a href="[#darkblue]LIEN2[/#]">Les produits</a>, applicatifs</div>
    bla bla bla
</div>

Bonjour à tous,
Ne me croyez pas si nouveau ici, je suis un lecteur régulier des articles, parfois du forum et des livres de Rodolphe et Raphaël, que j'ai posé neufs pour la première fois sur l'étagère il y a moins d'un an, quand j'ai pris en main mon destin d'ingénieur BTP spécialisé CAO en Freelance qui avait des besoins permanents en web.
Je ne prends plus de stagiaires ! Je bosse mes sites tout seul désormais.

Alors voilà, vous allez découvrir de suite que je suis un peu tordu.
Soit un bloc (class "englobe") auquel je donne un effet hoover. Je demande à jQuery de le transformer en hyperlien en faisant remonter le premier href rencontré en son sein.

Vous me voyez venir ; je voudrais que le deuxième (et les suivants) hyperliens entre balises <a> puisse continuer à jouer son rôle sans être affecté par la remontée à la div englobante que provoque ce code.
Hélàs, trop débutant, je m'interroge déjà sur la faisabilité et j'aurais vraiment ce besoin...
...
Qu'en pensez-vous ?

$(document).ready(function() {
      $('.englobe').hover(function() {$(this).addClass('hover');},function(){$(this).removeClass('hover');  })
		.click(function(event){
			event.stopPropagation() ;
			event.preventDefault() ;
			location.href($(this).find('a:eq(0)').attr("href"));
				return false;
		});
 });

Modifié par Bertram (25 Jun 2013 - 11:55)

http://dl.free.fr/kLj5IubWp

Un petit up avec le schéma plus clair de ce que je souhaite faire :

Que toute la boite englobante, quand elle est cliquée, diffuse le lien1 mais un lien2, tout seul, isolé, qui continuerait à fonctionner et non à aller vers le lien1.
A moins que cela ne soit faisable sans jQuery ?!...

Ceci est plus qu'un Up, j'ai travaillé

$(document).ready(function() {

	$('.services_block').hover(function() {$(this).addClass('hover');},function()
{$(this).removeClass('hover');  });

	$('.services_block, .services_block a , a').click(function(event){
		if($(this).is("div")){

			location.href($(this).find('a:eq(0)').attr("href"))}
		else{

			location.href = $(this).attr('href')};
	});

 });

J'ai réussi à écrire enfin quelque chose de logique. Ma selection de div est assurée par la classe services_block pour qui voudrait suivre.

Malheureusement
location.href n'est pas compris par certains navigateurs.
Pouvez-vous m'aider ?
Depuis le début je m'aide seul....

PS : Je cherche comment mieux formater le code sur ce forum en ce moment
Modifié par Bertram (16 Jul 2013 - 23:14)

Hello

La bonne syntaxe pour naviguer vers une nouvelle url la suivante :

window.location = url

ou

window.location.assign(url)

Pour ce qui est de tes liens imbriqués, la méthode event.stopPropagation() peux t'aider afin d'éviter que l'évènement click ne remonte toute la chaine.

Mais honnêtement j'ai un peu de mal à comprendre où tu veux en venir ^^

Le second fonctionne sur mes navigateurs !
Enfin, merci.

Il s'agit de plusieurs <a> dans un div.
Je souhaite que le div englobant soit, lui aussi, réactif et suive l'adresse indiquée par le premier <a>.

C'est tout.

J'ai donc remplacé location.href par window.location.assign

Peut-être y-a-t-il bien plus simple ? Je n'ai pas trouvé sans coder et je ne suis pas très expérimenté, n'est-ce pas ?