Jquery SlideToggle AND scroll

Question

J'ai un problème avec un lien slidetoggle qui apparaît au bas de ma page. En effet Je veux que l'utilisateur clique pour afficher/cacher la div caché (qui fonctionne très bien)

Le problème est la page ne défile pas vers le bas pour afficher le maintenant, pas caché div

En tant que novice JQuery , y a-t-il un moyen de basculer le div puis de le centrer sur la page? Ou au moins faire défiler vers le bas, sans que les choses deviennent trop compliquées?

Merci

Answer 1

Pour exécuter cette fonction, je vous recommande d'utiliser un rappel de votre appel slideToggle pour régler le défilement du document à l'aide de la fonction scrollTop. Vous serez en mesure de déterminer la valeur du paramètre setTop en utilisant offset pour obtenir la position supérieure du conteneur basculé par rapport à la page. Je suggère de restreindre le comportement de défilement à seulement feu quand l'élément est montré, pas caché.

En général, le paramétrage direct de la page peut être un UX légèrement discordant. Pour cette raison, je vais vous donner du code qui anime scrollTop plutôt que de le définir directement à l'aide de la fonction scrollTop, mais cette approche n'est pas nécessaire car un appel direct à scrollTop positionnera également la page. Je pense juste en tant qu'utilisateur que je préférerais voir un défilement progressif plutôt qu'un changement de position soudain.

Le code, par exemple, prendrait la forme:

$(".myShowHideLink").click(function() { 
    $(".myToggleContainer").slideToggle("slow", function() { 
     if ($(this).is(":visible")) { 
      $(document).animate({ 
       scrollTop: $(this).offset().top 
      }, "slow") 
     } 
    }); 
}); 

Vous pouvez utiliser effectivement $(this).offset().top - 50 ou quelque chose de similaire Dirige tout le défilement à quelques pixels au-dessus du haut du récipient, mais est en place à toi. Je trouve que je n'aime pas que mes éléments butent contre la bordure supérieure de la fenêtre. Je m'excuse de ne pas avoir créé un cas de test pour cela car je tourne à partir de la hanche, mais si cela ne fonctionne pas comme annoncé, faites le moi savoir et je vais ajuster le code.