Amélioration d'une boite flotante...

Résolu
Signaler
Messages postés
9
Date d'inscription
vendredi 4 octobre 2002
Statut
Membre
Dernière intervention
18 juillet 2008
-
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
-
Bonjour à tous, alors voilà:

J'ai un script qui me permet d'ouvrir une boite (qui se voit à moitié) lorsque je passe la souris deçu via la fonction h_open(), puis qui me permet également, en cliquant sur la boite, de la refermer via la fonction h_close().

Enfaite j'aimerai que tant que la la boite ne soit pas complettement ouverte, il soit impossible d'effectuer la fonction h_close(), puis que lors de la fermeture de la boite, il soit impossible d'effectuer la fonction h_open().

J'ai pensé à mettre peut étre un timer (genre par exemple quand la fonction h_open() est demandé, bin durant 3 seconde il est impossible d'éxecuter la fonction h_close()), ou bien un controle du genre: tant que la variable "p" n'est pas égale à 0 il est impossible d'éxécuter la fonction h_close() et tant que la variable "p" n'est pas égale à -135 il est impossible d'éxécuter la fonction h_open()

Enfin voilà je ne sais pas quoi faire et comment le faire, donc je suis ouvert à toute aide..

Voici mon CODE:
<hr />
<head>

<style type="text/css" media="screen">

/* BLOC gauche menu déroulant */
#menuderoulant {
  background: url('image/boite.png') no-repeat top left;
  position:fixed;
  top:145px;
  width:160px;
  height:110px;
  padding-top: 9px;
  padding-bottom: 9px;
  padding-left: 20px;
  padding-right: 30px;
  visibility: visible;
}

</style>

<script>
<!-- fonction Menu déroulant gauche -->

var p=-135;
var iTimer = null;

<!-- ouverture menu -->
function h_open(){ 
clearTimeout( iTimer); 
document.getElementById("menuderoulant").style.left = p +"px"; 
if(p < 0){   
p=p+5;   
iTimer = setTimeout("h_open()",1); 
}
}
<!-- fermeture menu -->
function h_close(){ 
clearTimeout( iTimer); 
document.getElementById("menuderoulant").style.left = p +"px"; 
if(p > -135){   
p=p-5;   
iTimer = setTimeout("h_close()",1); 
}
}

</script>

</head>

<!--  // Affichage Boite flotante sur la gauche    -->

<script>
document.write('
');}

document.write('
Un problème,
une question !

[aide.php Cliquez ici pour nous contacter.]

');

document.write('
');}
</script>

<hr />

Voilà, merci encore pour votre aide...
Ciao,
Nath

3 réponses

Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
dans ce cas mettre sur le onmouseout une fonction de fermeture qui, elle, fait appel à un setTimeout de la fonction h_close avec un délai de 10 s
;O)
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Bonjour,
essaies avec un flag que tu mets a true lorsque la boîte est entièrement ouverte et autorise la fonction de fermeture que si ce flag est true
;O)
Messages postés
9
Date d'inscription
vendredi 4 octobre 2002
Statut
Membre
Dernière intervention
18 juillet 2008

Bin personnellement j'aurai préférer avec un TIMER.

Enfaite je viens de modifier dans mon code le onClick="h_close()" par un onMouseout="h_close()"

Ce qui donne:
<hr />
<!--  // Affichage Boite flotante sur la gauche    -->



<script>
document.write('
');}



document.write('
Un problème,
une question !

[aide.php Cliquez ici pour nous contacter.]

');



document.write('
');}


</script>
<hr />



Donc j'aimerai bien mettre un timer de par exemple 10 secondes sur le onMouseout="h_close()"  ou sur la fonction  h_close()" ; de sorte que lorsque l'utilisateur quitte la zone de la boite avec la souris, la boite ne se referme qu'après 10 secondes.

Voilà donc si vous avez une idée sur la réalisation de ceci, je suis à l'écoute

Merci.