Faire defiler des li en jquery
diagui33
-
diagui33 -
diagui33 -
Bonjour,
je souhaite pouvoir faire defiler des li dans une zone en jquery ou autre d'ailleur.
exemple:
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
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
-
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-
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 -
-
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 -
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 -
-
