Faire defiler des li en jquery

diagui33 -  
 diagui33 -
Bonjour,
je souhaite pouvoir faire defiler des li dans une zone en jquery ou autre d'ailleur.
exemple: 
<ul id="defil">
      <li style="display:block"> mesg 1 </li>
      <li style="display:none"> mesg 2 </li>
      <li style="display:none"> mesg 3 </li>
      <li style="display:none"> mesg 4 </li>
      <li style="display:none"> mesg 5 </li>
</ul>

sur ce bout de code, le texte afficher est "mesg 1", je voudrai maitenant au bout de quelque seconde afficher "mesg 2" et masquer tout les autres, ensuite "mesg 3" est affiché et les autres masqué, ainsi de suite jusqu'au dernier des li c'est a dire qu'apres quelque seconde d'affichage de 'mesg 5', on repart sur "mesg 1" et on boucle comme ça indefinement.
Je ne suis pas tres à l'aise en javascript mais je me suis documenté et vu que ça pouvais se faire avec la methode js setInterval. mais je ne sais comment faire pour varier sur les li.
Merci pour vos contributions

1 réponse

Réponse 1 / 1
wAxxx Messages postés 421 Date d'inscription   Statut Membre Dernière intervention   46
 
Salut,

Première solution, utilise l'attribut CSS du jquery ainsi que la fonction sleep,

je te donne un exmple

supposant je veux changer l'attribut display du premiere balise li en none au lieu de block
je donne un id d'abord à mon li par exemple <li id="li1" style="display:block"> mesg 1 </li>

puis à l'aide de jquery je fais :
jQuery('#li1').css({'display' : 'none'});

Bah tu peux meme ,joeur avec ce petit code avec les fonctions .delay() .fadeIn() et .slideUp par exemple
0
diagui33
 
desolé j'ai pas tres bien compris. toutefois j'ai essayé ce bout de code mais il fait disparaitre le premier des li au bout de 3 seconde mais apres rien ne s'affiche; 
    $("#lastnews ul li").each(function(){
        setTimeout(function(){$("#lastnews ul li").fadeOut('normal');}, 3000);
    });

si tu m'en dire plus sur la façon de faire. ça sera super. merci en tout les cas
0
Profil bloqué
 
Tu pourrais éventuellement utiliser .hide() aussi ;)
0
diagui33
 
la n'est pas le probleme d'afficher ou de masquer un element: je peux utiliser css(display:none/display: block), fadeOut/fadeIn, hide/show. mon probleme est que je ne sais pas comment iterer sur les elements pour masquer tous les autres sauf le courant, ensuite masquer tout les autres sauf le suivant, ainsi de suite. je ne sais pas si j'ai été un peu plus clair.
merci quand meme de l'aide
0
diagui33
 
j'ai reussi a faire ceci: ça fonctionne mais l'effet n'est pas tres bien a mon gout. 
   var i = 1;
    var n = $('#lastnews ul li').length;
    $(function(){
        setInterval(function(){
            i++;
            if(i > n) i = 1;
            $("#lastnews ul li").hide('fast');
            $("#li_news_"+i).show('fast');
         },10000);
     });

comment puis-je faire un effet fondu? merci
0
Profil bloqué
 
.hide(500) peut-etre, du moins, je dis ca, mais je ne suis vraiment pas tres calé sur la question... :/
0

Discussions similaires

Chanson la li la li la la la?
blue44650 -
Fb75013 -

3 réponses
titre techno house annees 90
Poudie -
Capucine -

21 réponses
defilement photos
Sophie36 -
Utilisateur anonyme -

2 réponses
Faire défiler et supprimer des photos sur Mac
Vincent-CT -
Jeanmi -

5 réponses
La la la dee la da da dee, dee la la la
Syltheril -
ludeb_0155 -

10 réponses