bug sous ie et firefox, jquery Résolu/Fermé

Question

Bonjour, 
 

j'ai un petit problème sur mon site, en fait j'ai utilisé des méthodes en jquery pour pouvoir créer des effets, ça marche bien sur chrome mais pas sur firefox et ie. 
aidez moi svp, ça fait des heures que j'essaye des trucs mais j'arrive pas du tout :( 

une partie du codage : 

$('#m1').mouseenter(function(){ 

document.getElementById('m1').style.cursor='pointer'; 

if ($("#m1").css('background-image') == 
'url(http://www.*****.fr/test/BTNINSTALLATION.png)'){ 


$('#cadre1').fadeIn("slow"); 
} 

else{ 

document.getElementById("m1").style.backgroundImage = 
'url("http://www.****.fr/test/BLANC-VERT.png")' ; 
$('#cadre1').hide(); 
} 
}); 



$('#m1').mouseleave(function(){ 

document.getElementById('m1').style.cursor='pointer'; 

if($("#m1").css('background-image') == 
'url(http://www.****.fr/test/BTNINSTALLATION.png)'){ 
document.getElementById("m1").style.backgroundImage = 
'url("http://www.****.fr/test/BTNINSTALLATION.png")'; 
} 
else{ 
document.getElementById("m1").style.backgroundImage = 'url("http://www.****.fr/test/BLANC.png")'; 

} 
}); 


$('#m1').click( function(){ 

if ($("#m1").css('background-image') != 
'url(http://www.***.fr/test/BTNINSTALLATION.png)'){ 
$('#m1').css('background-image', 
'url(http://www.****.fr/test/BTNINSTALLATION.png)'); 

$('#m1').css('color', 'white');	

$('#cadre1').css('background-image', 'url(http://www.****.fr/test/INSTALLATION.png)').fadeIn("slow"); 

} 
}); 


le problème est quand quand je clique sur "m1" ce qui rend le background-image BTNINSTALLATION ensuite j'enlève ma souris ça passe en BLANC c'est à dire le esle de mouseleave alors que logiquement ça doit rester le background-image BTNINSTALLATION 

Configuration: Windows 7 / Chrome 22.0.1229.94

Utilisateur anonyme · Answer

Bonjour

Ajoute un alert ($("#m1").css('background-image')); au début de ton mouseleave.  Tu verras ce qu'il y a vraiment, et ça devrait te donner une idée de ce qui cloche dans ton test.

Utilisateur anonyme · Answer

J'ai reproduit ton code pour voir et j'ai eu le même problème. 
Je t'avais demandé de mettre un alert ($("#m1").css('background-image'));  : l'as-tu vraiment fait ? As-tu vraiment regardé la différence de comportement entre Chrome et FF  (je n'ai pas essayé IE) 
Chrome affiche 
url(http://www.****.fr/test/BTNINSTALLATION.png) 
Alors que FF affiche 
url("http://www.****.fr/test/BTNINSTALLATION.png") 
Il y a des " en plus. 
Donc ton test ne convient pas 

Modifie tous tes tests : 
if(($("#m1").css('background-image') ==  
'url(http://www.****.fr/test/BTNINSTALLATION.png)')||($("#m1").css('background-image') ==  
'url("http://www.****.fr/test/BTNINSTALLATION.png")'))
(attention, quand tu testes !=, il faut mettre && à la place de ||

maka54 · Answer

C'est du grand n'importe quoi ce code ....  


mouseenter, mouseleave, click .... c'est le merdier, et les tests de background n'en parlons meme pas 

Voilà une piste que devrais t'aider 


css : 

#m1{ 
background-image:url(image par défaut); 
} 

#m1:hover{ 
background-image:url(image lorsque le pointeur est sur l'element); 
} 


#m1.click{ 
background-image:url(image lorsque  l'element a été cliqué); 
} 

#m1.click:hover{ 
background-image:url(image lorsque  l'element a été cliqué et que le pointeur est sur l'element); 
} 



js : 

$('#m1').click( function(){  
 $(this).addClass('click'); 
});

Bug sous ie et firefox, jquery

3 réponses

Discussions similaires