Comment créer un lien vers une position spécifique sur une page Web?
Est-il possible de créer un lien hypertexte vers une position de défilement spécifique sur une page Web? Par exemple, j'aimerais créer un lien vers http://www.stackoverflow.com/ , mais avec le défilement de la page de 100 pixels.
Vous pouvez faire défiler jusqu'à une position donnée en utilisant le plugin jQuery scrollTo . Si vous regardez sa page de démonstration , vous verrez que le plug-in est capable de nombreuses options différentes, y compris le défilement jusqu'à une certaine position. Cela signifierait toutefois que vous deviez contrôler le code JavaScript de la cible, ce qui pourrait ne pas convenir à un lien vers un site externe.
Le lien vers la Vanille vers quelque part dans la page se fait via un point d'ancrage déjà présent dans la page.
Ceci peut être créé en utilisant la balise <a>…</a>. Notez que le lien spécifié dans "point d'ancrage" (ci-dessus) a #h-12.2 à la fin. Cela correspond à <a id="h-12.2">12.2</a> intégré dans le code HTML formant la page et, lorsque vous cliquez dessus, repositionnera la vue de la page sur cette ancre.
Notez qu'avant HTML5, l'attribut name était utilisé dans la balise d'ancrage, mais n'est plus pris en charge et l'attribut id doit être utilisé à sa place ( reference ). Cela signifie également que vous pouvez utiliser n'importe quel élément pour une balise d'ancrage. Vous n'êtes pas limité à l'élément <a>.
Semblable à la réponse de Paul, vous pouvez également créer un lien vers la première occurrence d'un identifiant de tag dans un document HTML. Ce ne sera cependant pas un nombre exact de pixels.
Par exemple, liez/faites défiler les réponses de cette page ou .
Essayez de cliquer avec le bouton droit de la souris et d’inspecter les éléments sur la page. Vous trouverez les balises <a>, ce sont les points d'ancrage.
Sortez ensuite le < avant la première et la dernière a afin qu’ils ne s'affichent pas en tant que liens. Vous pouvez réellement voir les effets tout en écrivant dans la zone de réponse quand elle vous montre l'aperçu ci-dessous.
a href="https://superuser.com/questions/382047/linking-to-a-specific-scroll-position-on-a-web-page#question-header">question /a>
et
a href="https://superuser.com/questions/382047/linking-to-a-specific-scroll-position-on-a-web-page#answers">answers /a>
Comme vous pouvez le constater, la seule différence se situe à la toute fin, où les noms d'ancre suivent le symbole dièse (#). le nom après le > indique comment le lien est lu à l'utilisateur.
Dans ce cas, "en-tête de question" se lit comme "question" et les réponses se trouvent être les mêmes.
Ensuite, les éléments suivants doivent être liés au commentaire de de Mike . Puisque leur point d'ancrage est 382094
Pour clarifier, vous pouvez simplement trouver l'ancre et ajouter le # après votre lien.
https://superuser.com/questions/382047/linking-to-a-specific-scroll-position-on-a-web-page#question-header
https://superuser.com/questions/382047/linking-to-a-specific-scroll-position-on-a-web-page#answers
https://superuser.com/questions/382047/linking-to-a-specific-scroll-position-on-a-web-page#880079
tout cela vous mènera à différents endroits sur la même page.
Pour créer un lien vers une position spécifique au pixel sur une page, placez la balise d'ancrage à l'intérieur d'un div qui est positionné de manière absolue en utilisant les coordonnées "top: x left: y".
Vous pouvez utiliser Citebite pour créer un lien vers une position spécifique d'une page Web, même si elle n'utilise pas id à cette position. C'est facile a utiliser. Allez simplement sur le lien que j'ai fourni ici, puis collez le morceau de texte que vous voulez montrer en premier après être allé sur votre page Web dans le champ de texte Devis, puis indiquez le lien de la page Web dans le champ de texte Source URL. Cliquez ensuite sur Make Citebite. Ensuite, il va générer un lien. Ce lien sera votre lien souhaité.