Bonjour à tous,
je rencontre un bogue assez étrange que je ne m'explique pas, d'autrant que ce bogue n'apparait que sous Firefox (3.0.14) sous Windows XP; sous IE6&7, Opera et Safari sous Windows XP, tout est ok.
=> La situation?
Et bien l'objectif est d'afficher une popin "Envoi à un ami" au roll d'un bouton.
Pour cela, je place dans une même <div> "bloc_partage_ami", la popin <div> "popin_envoi_ami" et le lien <a> "bt_envoi_ami"
A noter que la class "invisible" n'est qu'un simple {display:none}
Pour afficher la popin, un evenement "onmouseover" et un evenement "onmouseout" sont attachés au div "bloc_partage_ami".
la fonction initPopinActuAmi() est appelée au chargement de la page;
=> Le bogue ?
Et bien sous Firefox 3.0.14 sous Windows XP, lorsqu'on passe, un peu vite, la souris sur les input text, la popin disparait : l'evenement onmouseout semble être exécuté !?!
Je ne comprends pas le pourquoi du comment...
A noter que j'ai trouvé une solution en plaçant un autre div plus grand (width et height) que "bloc_partage_ami" sous ce même div "bloc_partage_ami" et en attachant l'veenement onmouseout dessus plutôt qu'à "bloc_partage_ami" .
Mais bon, vous l'aurez deviné, cette solution ne me satisfait pas même si elle règle mon problème.
Donc si quelqu'un a une idée, je suis preneur.
Merci d'avance.
Modifié par zemp (16 Oct 2009 - 16:21)
je rencontre un bogue assez étrange que je ne m'explique pas, d'autrant que ce bogue n'apparait que sous Firefox (3.0.14) sous Windows XP; sous IE6&7, Opera et Safari sous Windows XP, tout est ok.
=> La situation?
Et bien l'objectif est d'afficher une popin "Envoi à un ami" au roll d'un bouton.
Pour cela, je place dans une même <div> "bloc_partage_ami", la popin <div> "popin_envoi_ami" et le lien <a> "bt_envoi_ami"
<div class="bloc_partage_ami" id="bloc_partage_ami">
<a class="bt_envoi_ami" href="#" >J'envoie à un ami</a>
<div id="popin_envoi_ami" class="invisible">
<form name="form_actu_friend" action="#" method="post" onsubmit="return ;">
<label for="">Nom</label>
<input type="text" class="input_text" name="" id="" />
<br />
<label for="">Prénom</label>
<input type="text" class="input_text" name="" id="" />
<br />
<label for="">Email</label>
<input type="text" class="input_text" name="" id="" />
<br />
<label for="">Email ami</label>
<input type="text" class="input_text" name="" id="" />
<br /><br />
<input type="submit" name="valider_ami" id="valider_ami" value="Envoyer" />
</form>
</div>
</div>
A noter que la class "invisible" n'est qu'un simple {display:none}
Pour afficher la popin, un evenement "onmouseover" et un evenement "onmouseout" sont attachés au div "bloc_partage_ami".
//Popin "Envoi à un ami"
var showPopinActuAmi = function(){
var el = document.getElementById('popin_envoi_ami');
if(el){
el.className="popin_envoi_ami";
}
}
var hidePopinActuAmi = function(){
var el = document.getElementById('popin_envoi_ami');
if(el){
el.className="invisible";
}
}
function initPopinActuAmi(){
var bloc_partage_ami = document.getElementById('bloc_partage_ami');
if(bloc_partage_ami){
bloc_partage_ami.onmouseover=showPopinActuAmi;
bloc_partage_ami.onmouseout=hidePopinActuAmi;
}
}
la fonction initPopinActuAmi() est appelée au chargement de la page;
=> Le bogue ?
Et bien sous Firefox 3.0.14 sous Windows XP, lorsqu'on passe, un peu vite, la souris sur les input text, la popin disparait : l'evenement onmouseout semble être exécuté !?!
Je ne comprends pas le pourquoi du comment...
A noter que j'ai trouvé une solution en plaçant un autre div plus grand (width et height) que "bloc_partage_ami" sous ce même div "bloc_partage_ami" et en attachant l'veenement onmouseout dessus plutôt qu'à "bloc_partage_ami" .
Mais bon, vous l'aurez deviné, cette solution ne me satisfait pas même si elle règle mon problème.
Donc si quelqu'un a une idée, je suis preneur.
Merci d'avance.
Modifié par zemp (16 Oct 2009 - 16:21)