Icône cliquable dans HTML pour aller sur la même page plus bas

Fermé
G_Mld - Modifié le 14 août 2017 à 11:13
arshi92 Messages postés 131 Date d'inscription mercredi 27 juin 2012 Statut Membre Dernière intervention 12 octobre 2017 - 12 oct. 2017 à 11:46
Bonjour,

Je suis en train de créer une page Internet pour lister des entreprises en 4 catégories. Je vais tout lister à la suite.
J'aimerais donc, au début de ma page, insérer 4 icônes cliquables qui redirigent à la catégories correspondent. Il ne s'agit donc pas de changer de page, tout sera sur la même page.
Le principe est celui de Wikipédia où on peut cliquer sur le sous-titre qui nous intéresse et on arrive directement dessus.

J'ai écrit ça, mon icône est cliquable, mais je suis redirigée vers une autre page du site et non pas plus bas :

<p class="align-left"><a href="http://siteinternet.com/#FoodandBeverage" rel="nofollow noopener noreferrer" target="_blank"><img src="image" width="40" height="40" alt="" data-htmlarea-file-uid="420392" style="vertical-align: text-bottom;" /> 

<h1 id="FoodandBeverage">Food and Beverage</h1>
<p class="align-left"></p>

1 réponse

arshi92 Messages postés 131 Date d'inscription mercredi 27 juin 2012 Statut Membre Dernière intervention 12 octobre 2017 17
12 oct. 2017 à 11:46
Bonjour

Il faut :
1 - Enlever le ' target="_blank" ' au niveau du lien , car ça ouvre un nouvel onglet
2 - Mettre juste l'id au niveau du href et non le lien plus le id.

Donc ça devient ( J'ai ajouter un div avec hauteur pour que tu puisse sentir l'effet ).

<p class="align-left"><a href="#FoodandBeverage" rel="nofollow noopener noreferrer" target="_blank"><img src="image" width="40" height="40" alt="" data-htmlarea-file-uid="420392" style="vertical-align: text-bottom;" /> 
<div style="height:800px;"></div>
<h1 id="FoodandBeverage">Food and Beverage</h1>
<p class="align-left"></p> 
0