pb lien ancre

danielsan

Bonjour,


je souhaite faire un lien du type

<a href="#ancre">Aller à l'ancre</a>

puis à l'aide de ce script JS:

<script type="text/javascript">
	$('a[href^="#"]').click(function(){  
		var the_id = $(this).attr("href");  
		$('html, body').animate({  
			scrollTop:$(the_id).offset().top  
		}, 'slow');  
		return false;  
	});
</script>

cela me fait (normalement) un scrollto automatique.


Le problème c'est que mon lien se transforme en:

<a href="http://monsite.com/article#ancre">Aller à l'ancre</a>

alors ça ne marche plus
Quelqu'un a une idée pour palier à ce pb ?
Comment faire pour éviter que le lien ne se "transforme" ?


Cordialement,

Merci.
_____
D.San

danielsan

En attendant j'ai mis un identifiant à mon lien

<a href="#diapo" id="gotodiapo">Voir le diapo</a>

et le JS est celui-ci:

<!-- debut script scrolltolight -->
	<script type="text/javascript">
		$('#gotodiapo').click(function(){
			var the_href = $(this).attr("href");
			var taille_href = the_href.length;
			var pos_diese = the_href.indexOf("#");
			var nom_ancre = the_href.substr(pos_diese);
			$('html, body').animate({
				scrollTop:$(nom_ancre).offset().top
			}, 'slow');
			return false;
		});
	</script>
<!-- fin script scrolltolight -->

il doit sûrement y avoir pus simple

Stéphane

Salut
Essaye avec ça

<a href="<?php $plxShow->urlRewrite('#ancre') ?>">Aller à l'ancre</a>

danielsan

merci mais ça ne change rien ... petite précision: le lien est placé dans le template.

Jerry Wham

Un id sera toujours plus fiable pour faire fonctionner le js (le code sera portable et ne dépendra pas d'une url changeante d'un projet à l'autre). Et si js est désactivé, alors l'ancre prend tout son sens et amène ton visiteur à l'endroit voulu. Donc je dirais que le fonctionnement que tu décris est normal et que ta proposition avec l'id est la meilleure.


Ça respecte la sémantique et le rôle premier de l'ancre et du lien et le javascript n'est ainsi pas intrusif.

danielsan

hello Jerry,


justement la première proposition est un code générique où l'on se fiche de l'identifiant du lien puisqu'il est basé sur l'adresse du lien qui est elle-même associé à l'identifiant de l'ancre ...

<a href="#diapo">Aller au diapo</a>

...

<div id="diapo">Le diapo</div>