Image en cascade

Le problème exposé dans ce sujet a été résolu.

Bonsoir ! Ayant aucune compétence en javascript, j'ai récuperé un script pour afficher des images en cascade seul problème c'est que j'aimerais bien choisir les images à afficher et à cacher moi même. Voici donc le script :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
<button id="affiche">Faire apparaître les images</button>
<button id="cache">Faire disparaître les images</button><br />
<img src="bon.png">
<img src="mauvais.png">
<img src="question.png">

<script src="jquery.js"></script>
<script>
  $(function() {
    $('#affiche').click(function() {
      $('img').first().show('slow', function showNextOne() {
        $(this).next('img').show('slow', showNextOne);
      });    
    });
    $('#cache').click(function() {
      $('img').first().hide('slow', function hideNextOne() {
        $(this).next('img').hide('slow', hideNextOne);
      });    
    });
  });
</script>

Si quelqu'un pourrait modifier ce script je le remercie d'avance !

+0 -0

Si quelqu'un pourrait modifier ce script je le remercie d'avance !

Lixje

On est pas là pour donner des solutions toutes faites mais pour t'aider à trouver comment le faire par toi-même.

En dehors de ça ce serait pas mal de nous expliquer ce que tu veux faire exactement : en soit à part afficher/cacher des images on en sait pas beaucoup plus : sois précis.

+0 -0

Et bien, le script sélectionne seulement les images de la div, alors j'ai simplement fais une div spécial pour les images que je souhaite afficher/cacher ;)

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<script src="jquery.js"></script>
<script>
  $(function() {
    $('#affiche').click(function() {
      $('img').first().show('slow', function showNextOne() {
        $(this).next('img').show('slow', showNextOne);
      });    
    });
    $('#cache').click(function() {
      $('img').first().hide('slow', function hideNextOne() {
        $(this).next('img').hide('slow', hideNextOne);
      });    
    });
  });
</script>

<div class="content">
  <div class="left">
    <div class="avatar">
    OK
    </div>
  </div>
  <div class="right">
    <div class="add">
    ADD
    </div>
  </div>
  <div class="center">
    <div class="listeimg">
    <img src="images/up7.png" style="width: 30px; height: 30px;margin-top: 8px;">
    <img src="images/up7.png" style="width: 30px; height: 30px;margin-top: 8px;">
    <img id="cache" src="images/up7.png" style="width: 30px; height: 30px;margin-top: 8px;">
    <div class="imgaffiche">
    <img id="affiche" src="images/up7.png" style="width: 30px; height: 30px; margin-top: 8px;">
    </div>
    </div>
  </div> 
</div>
+0 -0
Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte