J'ai passé un bon moment à essayer de trouver des réponses à ce problème, mais je n'ai pas réussi. Fondamentalement, je dois faire défiler l'utilisateur jusqu'à la partie contact du site Web lorsqu'ils se rendent sur healthdollars.com/#contact. Cela fonctionne très bien dans Safari, mais dans Chrome, je n'ai pas eu de chance. J'ai essayé d'utiliser jQuery / Javascript pour forcer le navigateur à défiler vers le bas, mais je n'ai pas pu.

Quelqu'un a-t-il une idée? Cela me rend fou - d'autant plus que c'est une chose si simple à faire.

1
anguiac7 5 mars 2016 à 00:29

5 réponses

Meilleure réponse

Pas une réponse complète mais dans Chrome si vous désactivez Javascript, je crois que vous obtenez le comportement souhaité. Cela me fait croire que quelque chose dans votre JavaScript empêche le comportement du navigateur par défaut.

2
tbcorr 4 mars 2016 à 21:43

Peut-être que cette solution de contournement avec javascript vanille peut être utile:

// Get the HTMLElement that you want to scroll to. 
var element = document.querySelector('#contact');
// Stories the height of element in the page.
var elementHeight = element.scrollHeight;
// Get the HTMLElement that will fire the scroll on{event}.
var trigger = document.querySelector('[href="#contact"]');    
trigger.addEventListener('click', function (event) {
  // Hide the hash from URL.
  event.preventDefault();
  // Call the scrollTo(width, height) method of window, for example.
  window.scrollTo(0, elementHeight);
})
-1
Alexandre Thebaldi 4 mars 2016 à 21:42

L'attribut name n'existe pas dans HTML 5, donc chrome semble avoir rendu l'attribut name obsolète lorsque vous utilisez le html DOCTYPE.

Les autres navigateurs n'ont pas encore rattrapé leur retard.

Changement

<a name="contact"></a>

À

<a id="contact"></a>
0
John 4 mars 2016 à 21:51

Il me semble que l'élément cible n'existe pas lors du premier chargement de la page. Je n'ai aucun problème si je navigue vers la page, puis ajoute le hachage.

if (window.location.hash.length && $(location.hash)) {
  window.scrollTo(0, $(location.hash).offset().top)
}

Rechercher un hachage, trouver le décalage de page de l'élément et y faire défiler (x, y).

Edit: j'ai remarqué qu'en fait, la page commence à #contact, puis revient en haut. Je suis d'accord avec l'autre répondeur qu'il y a quelque chose sur votre page qui vous fait défiler vers le haut. Je rechercherais cela avant d'ajouter un hack.

1
AJFarkas 4 mars 2016 à 21:59

Vous pouvez le faire avec JS, par exemple` si vous avez JQuery.

$(function(){
  // get the selector to scroll (#contact)
  var $to = $(window.location.hash);

  // jquery animate
  $('html'/* or body */).animate({ scrollTop: $to.offset().top });
});
0
VahagnNikoghosian 4 mars 2016 à 21:40