<html><head>
<style type="text/css">
.help { position: absolute;
left: 300px;
top: 20px;
visibility: hidden;
width: 100px;
padding: 10px;
border: 1px solid #f00;
}
form { margin: 20px; background-color: #DFE1CB;
padding: 20px; width: 200px }
form a {color: #060; text-decoration: none }
form a:hover {cursor : help}
</style>
<script language="javascript">
var item = null;
function afficherAide(newItem) {
if (item) {
item.style.visibility='hidden';
}
item = document.getElementById(newItem);
item.style.visibility='visible';
}
</script>
</head>
<body>
<form>
<label><a href="javascript:afficherAide('aide1')" alt="get help">Username(Aide?)</a></label>
<input type="text"><br /><br />
<label><a href="javascript:afficherAide('aide2')" alt="get help">Mot de Passe(Aide?)</a></label>
<input type="text">
</form>
<div id="aide1" class="help">
Ceci est un exemple d'aide qui s'affiche lorsque l'utilisateur clique sur le label d'Aide # 1
</div>
<div id="aide2" class="help">
Ceci est un exemple d'aide qui s'affiche lorsque l'utilisateur clique sur le label d'Aide # 2
</div>
</body>
</html>
|
Cet article Javascript: Utilisation d’un champs d’aide caché est apparu en premier sur .
