11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

J'ai fais un petit bout de code qui doit au passage de la souris sur un élément A, afficher un élément B juste en dessous. Lorsque la souris quitte la zone l'élément B doit disparaître.

Voici mon code :
JavaScript
function montre(id)
{
var d = document.getElementById(id);
d.style.display='block';
}
function cache()
{
document.getElementById('login').style.display='none';
}

HTML
<div class="pour_login"><h2 onMouseOver=montre('login'); >Connexion</h2>
<div id="login" onMouseOver=montre('login'); onMouseOut=cache();>
<?php sidebarlogin(); ?>
</div>
</div>

Le problème il y en a forcément un c'est que l'élément B (id="login") s'affiche directement au chargement de la page or je ne veux pas qu'il s'affiche automatiquement.
Modifié par cssmaster (23 Nov 2011 - 18:34)
J'ai trouvé une solution.
Il faut forcer l'exécution de la fonction cache(); au chargement de la page.
Voici le code HTML sachant que le Javascript n'a été modifié :
<div class="pour_login"><h2 onMouseOver=montre('login'); >Connexion</h2>
<div id="login" onMouseOver=montre('login'); onMouseOut=cache();>
<script>cache();</script>
<?php sidebarlogin(); ?>
</div>
</div>

J'ai simplement ajouté <script>cache();</script>

En espérant que ça en aide quelques uns.