Masquer des images avec javascript

Fermé

L - Modifié par L le 4/05/2011 à 18:43
L - 8 mai 2011 à 16:21

Bonjour,

voilà j'aimerais cacher/afficher des images après avoir cocher un checkbox (ou un bouton radio) qui s'appelle ici "partie 1".
mon code:

<input type="checkbox" value="part1" onclick="voirImg()"/>partie 1<br/>   
<div id='lesimages'>   
   <img src="images/image1.jpg" alt="fond1"><br/>   
   <img src="images/image2.jpg" alt="fond2"><br/>   
</div>   

<script>   
function voirImg() {   

var lesImg=document.getElementById('lesimages');   
for (var i=0; i<lesImg.length; i++) {   
  if ( lesImg[i].style.display == 'block') { lesImg[i].style.display = 'none';}   
  else { lesImg[i].style.display = 'block';}   
}   

}   
</script>

et j'ai initialisé dans le css:

#lesimages {display: 'none';}

mais je suis là donc ça ne marche pas: les images sont bien masquées mais cocher ne change rien.
Donc si quelqu'un pourrait me donner un p'tit coup de pouce ça serait top!! merci :)

A voir également:

Masquer des images avec javascript
Des images - Guide
Telecharger javascript - Télécharger - Langages
Masquer conversation whatsapp - Guide
Comment masquer les amis sur facebook - Guide
Application pour masquer les applications - Guide

3 réponses

Réponse 1 / 3

js95 Messages postés 773 Date d'inscription samedi 14 juin 2008 Statut Membre Dernière intervention 29 juillet 2014 354
4 mai 2011 à 20:30

<div id='lesimages'>

Ce code est incorrect. Les valeurs des attributs doivent être entre guillemets.

Réponse 2 / 3

js95 Messages postés 773 Date d'inscription samedi 14 juin 2008 Statut Membre Dernière intervention 29 juillet 2014 354
4 mai 2011 à 20:36

for (var i=0; i<lesImg.length; i++) {

le caractère < est source d'erreurs pour le navigateur.
Enveloppe le code de la balise script dans un bloc CDATA pour lever ce problème :

<script>

//<![CDATA[
 
function voirImg() {   

var lesImg=document.getElementById("lesimages");   
for (var i=0; i<lesImg.length; i++) {   
  if ( lesImg[i].style.display == "block") { lesImg[i].style.display = "none";}   
  else { lesImg[i].style.display = "block";}   
}   

} 

//]]>
  
</script>

C'est moche mais ça marche.

js95 Messages postés 773 Date d'inscription samedi 14 juin 2008 Statut Membre Dernière intervention 29 juillet 2014 354
4 mai 2011 à 20:39

J'ai un code semblable dans mon site mais j'utilise les guillemets pour les chaînes de caractères en Javascript (on peut utiliser les apostrophes mais bon).

js95 Messages postés 773 Date d'inscription samedi 14 juin 2008 Statut Membre Dernière intervention 29 juillet 2014 354
4 mai 2011 à 20:41

En fait sans le CDATA le < peut être interprété comme un début de balise, ce qui peut provoquer des problèmes.

Réponse 3 / 3

L
8 mai 2011 à 16:21

Merci beaucoup c'était surtout à cause des guillemets et apostrophes ^^'
Bye

Discussions similaires

calcule nombre des pixels "noir" dans un image (noir/blanc)

Javascript Arrondi à 2 chiffres après la virgule

voir ses images enregistrés

ou sont enregistrées les images

Story bloque