web-dev-qa-db-fra.com

CSS- Mettez en surbrillance un div lorsque l'id est lié à l'utilisation d'une ancre?

Ce que j'essaie de faire, c'est de mettre en évidence un div avec un certain id, quand il a été mentionné par une ancre sur une autre page IE:

L'utilisateur clique sur le lien href="qw.html#test", lorsque la page est chargée, puis le div avec le id="test" est mis en surbrillance pour que l'utilisateur puisse le voir clairement.

Je suis sûr que j'ai vu un exemple CSS3 où un div est mis en surbrillance s'il était lié à. Ou était-ce JavaScript?

52
harley_woop

Vous devez utiliser le :target pseudo-classe:

:target {
   background-color: #ffa;
}

JS Fiddle .

101
David Thomas

JavaScript peut être utilisé pour ajouter/modifier dynamiquement la classe du div:

Si tu as:

<div id="test"></div>

Fonction Javascript, exécutée par le clic de l'ancre:

document.getElementById("test").className += " highlighted";

Résultat:

<div id="test" class=" highlighted"></div>
0
blearn

Vous pouvez le faire en JavaScript. Reportez-vous à Comment obtenir l'ancre de l'URL à l'aide de jQuery? sur la façon d'obtenir l'ancre de l'URL et cela peut être quelque chose de simple comme

document.getElementById(hash).style.backgroundColor="Yellow";
0
Yuriy Galanter