javascript - Existe-t-il une méthode plus rapide dans vue.js pour faire défiler l'interface actuelle jusqu'à une certaine partie?
为情所困
为情所困 2017-05-18 10:45:35
0
8
631

Par exemple, couramment utilisée pour revenir en haut, une page HTML ordinaire peut définir l'attribut href de la balise a sur un certain identifiant, puis faire défiler la barre de défilement jusqu'à cette partie lorsque vous cliquez dessus (bien sûr, vous pouvez également définir directement la hauteur de la barre de défilement) .

Mon exigence actuelle est de cliquer sur différents boutons dans le même composant vue pour faire défiler la barre de défilement jusqu'à la partie correspondante (l'effet de défilement est facultatif). Si vous utilisez directement la méthode mentionnée ci-dessus, cela déclenchera un saut de page. Si vous définissez directement la hauteur de la barre de défilement, vous devrez obtenir les positions une par une, ce qui n'est pas aussi simple que la première.

S'il vous plaît, donnez-moi quelques conseils, avez-vous une meilleure idée pour réaliser cette exigence ?

为情所困
为情所困

répondre à tous(8)
phpcn_u1582

Element.scrollIntoView()

Il s'agit d'une API native de JS Après l'appel, le navigateur fera défiler jusqu'à la position de l'élément cible.

https://developer.mozilla.org...

洪涛

Si vous ne pouvez pas utiliser de points d'ancrage, vous ne pouvez obtenir que la position de la barre de défilement de chaque partie.

曾经蜡笔没有小新

Vous ne pouvez utiliser que js. Comme suit, obtenez la distance entre l'élément cible et le haut de la page dans l'événement, puis contrôlez l'axe de défilement :

$(window).scrollTop( $("#caaa").offset().top )
阿神

D'un point de vue approximatif, la méthode du point d'ancrage est définitivement violente.

曾经蜡笔没有小新

Trouvez un plug-in js natif et importez-le

阿神

Même question ! Je ne sais pas non plus

给我你的怀抱

https://huahua0406.github.io/...

Il y a un défilement gauche et droit correspondant ci-dessous. Répond-il à vos exigences ?

大家讲道理

vue-router2

le routeur a pour fonction de simuler les points d'ancrage

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal