Mettre un lien en relief au passage de la souris

Commenter

Contenu du snippet

Un petit script pour personnaliser les liens hypertextes dans vos pages html.
Vous pouvez bien sûr modifier ce script à volonté, supprimer la mise en gras par exemple, etc.
Le script a l'avantage d'être plus simple à utiliser que les feuilles de styles.

Source / Exemple : 


<html>
<head>
<title>Mettre en relief un lien lors du passage de la souris</title>
<script>
function relief(lien,fond,couleur,gras) {

// Nouveau fond
lien.style.backgroundColor = fond;
// Nouvelle couleur
lien.style.color = couleur;

// Suppression du soulignement
lien.style.textDecoration = "none";

// Ajout de gras

if(gras) {
lien.style.fontWeight = "bold";
}

}

function fin(lien,fond,couleur,gras) {

// Fond originale
lien.style.backgroundColor = fond;
// Couleur originale
lien.style.color = couleur;

// Remise du soulignement
lien.style.textDecoration = "underline";

// Suppression du gras

if(gras) {
lien.style.fontWeight = "normal";
}

}
</script>
</head>
<body>
<a href="" onmouseover="relief(this,'darkblue','white',1)" onmouseout="fin(this,'white','black',1)" name="lien_1" style="color : #000000">Lien type</a><br><br>
<a href="" onmouseover="relief(this,'pink','green',0)" onmouseout="fin(this,'white','450045',0)" name="lien_2" style="color : #450045">Lien 2 type</a><br><br>
<a href="" onmouseover="relief(this,'darkgreen','yellow',1)" onmouseout="fin(this,'white','aa5588',1)" name="lien_3" style="color : #aa5588">Lien 3 type</a>
</body>
</html>

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (revinc)