Lien a afficher sur la même page avec bootstrap
Utilisateur anonyme
-
Utilisateur anonyme -
Utilisateur anonyme -
Bonjour,
Je suis en formation de développeur web (depuis 2 semaines). Je commence a découvrir Bootstrap.
J'ai un exercice a faire, j ai une idée bien précise de ce que je veux mais j'ai un problème
Voila j'ai créé un entête avec Jumbotron. Dans cet entête, j'ai mis une navbar (donc composée de divers liens avec les classiques a href).
Au clic sur ce lien j'aimerai que le texte correspondant s'affiche au dessous (toujours en gardant cet entête). Mon ennui c'est qu'au clic, le texte se charge dans une nouvelle fenêtre.
J'ai essayé plusieurs choses infructueuses (créer une page html et l'appeler avec une target _self, mettre dans mon a href un #suivi d'un identifiant et appeler cet identifiant plus bas dans un p id). Rien ne marche.
Si quelqu'un pouvait m'aider ce serait cool.
D'avance merci
--
Je suis en formation de développeur web (depuis 2 semaines). Je commence a découvrir Bootstrap.
J'ai un exercice a faire, j ai une idée bien précise de ce que je veux mais j'ai un problème
Voila j'ai créé un entête avec Jumbotron. Dans cet entête, j'ai mis une navbar (donc composée de divers liens avec les classiques a href).
Au clic sur ce lien j'aimerai que le texte correspondant s'affiche au dessous (toujours en gardant cet entête). Mon ennui c'est qu'au clic, le texte se charge dans une nouvelle fenêtre.
J'ai essayé plusieurs choses infructueuses (créer une page html et l'appeler avec une target _self, mettre dans mon a href un #suivi d'un identifiant et appeler cet identifiant plus bas dans un p id). Rien ne marche.
Si quelqu'un pouvait m'aider ce serait cool.
D'avance merci
Configuration: Windows / Chrome 77.0.3865.90
--
1 réponse
-
Salut,
Le comportement de base d'une balise 'a' c'est de charger une nouvelle page, avec target='self' ça indique dans la même page(donc aussi le comportement par défaut d'un lien).
il faut plutôt du JavaScript pour cela: changer quelque chose dans la page avec le DOM.
CSS sert à donner des propriétés aux éléments existants mais ne peut pas modifier le contenu.
Un exemple ici:
https://www.w3schools.com/jsref/prop_html_innerhtml.asp
