简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Maison > interface Web > tutoriel HTML > le corps du texte

Résumer l'utilisation des points d'ancrage en HTML et js

巴扎黑
Libérer： 2017-06-01 16:22:48
original
1986 Les gens l'ont consulté

Utilisation des points d'ancrage en HTML :

1.Explication détaillée de ce que sont les ancres HTML

La première étape dans l'apprentissage des connaissances Web est définitivement le HTML, parmi lesquels ancres HTML À quoi ça sert exactement ?

Pour faire simple, par exemple, si vous souhaitez lire un article très long avec précision par segment, vous pouvez utiliser des points d'ancrage.

Résumer lutilisation des points dancrage en HTML et js

2.Exemple d'utilisation d'un point d'ancrage HTML

Après avoir compris ce qu'est un point d'ancrage, comprenons comment l'utiliser.

Résumer lutilisation des points dancrage en HTML et js

Exemples d'utilisation de points d'ancrage en js :

1.Comment localiser un point d'ancrage en js

Les points d'ancrage peuvent être définis dans la page html et la définition du point d'ancrage

Résumer lutilisation des points dancrage en HTML et js

2.JS implémente l'effet d'affichage coulissant d'index et l'effet de point d'ancrage d'affichage coulissant de le carnet d'adresses

La première consiste à glisser sur la barre d'index sur le côté droit du carnet d'adresses. Lorsque vous glissez sur la lettre correspondante, il passera au point d'ancrage de la lettre correspondante. .

Idée : écoutez l'événement touchmove, obtenez clientX et clientY, transmettez-les à elementFromPoint, puis exécutez click() après avoir obtenu l'élément.

Résumer lutilisation des points dancrage en HTML et js

3.Exemple d'implémentation Javascript de l'effet de défilement d'ancre de navigation

Il peut y avoir une telle exigence dans les pages de développement courantes, la page Il y aura plusieurs modules dans le module, et chaque module correspond à une navigation Lorsque la page défile jusqu'à un certain module, le module de navigation correspondant doit ajouter une classe pour distinguer la zone parcourue par l'utilisateur actuel.

Résumer lutilisation des points dancrage en HTML et js

Questions et réponses liées à l'ancrage :

1.javascript - problème d'ancrage angulaire

2.angular.js - AngularJs contrôle la sortie de la page en définissant des liens d'ancrage

3.html5 - Problème d'ancrage d'une balise en HTML

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées：
锚点，html，js
source：php.cn
Article précédent：Résumé des symboles spatiaux et des entités de caractères spatiaux en HTML Article suivant：Résumer diverses méthodes d'utilisation des espaces en HTML
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Derniers numéros
Réécrivez le titre comme suit : Vue 3 : Transférer le contenu vers l'élément et remplacer J'utilise la téléportation de Vue3 pour restituer un élément dans un div et cela fonctionn...
Depuis 2023-11-06 11:01:38
0
1
451
Routeur Vue JS : recharger la page lors de la redirection J'ai une application avec les fichiers Login.vue et Home.vue. Parce que je convertis le si...
Depuis 2023-10-26 11:53:46
0
2
188
Laravel Carbon\Carbon :: setLastErrors() J'héberge ce laravelapi sur le site d'hébergement sharefd, j'ai apporté quelques modificat...
Depuis 2023-10-22 08:38:38
0
1
275
Modifier la valeur textNode Existe-t-il un moyen de modifier la valeur d'un DOMtextNode dans un navigateur Web ? Je vo...
Depuis 2023-10-17 20:55:25
0
2
261
Défilement : comment corriger les titres Je crée un en-tête qui se fixera et restera en place une fois défilé jusqu'à un certain no...
Depuis 2023-10-12 23:57:29
0
2
267
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois：Formation PHP en ligne sur le bien-être public，Aidez les apprenants PHP à grandir rapidement！