2013-05-22 3 views
0

Actuellement, je suis en utilisant ce code jquery que je suis d'un autre poste ici pour effacer quelques divs dans et horsRandomisez l'ordre de divs affichés et cachés en utilisant jquery

<script> 
$(document).ready(function() { 
    var divs = $('div[id^="feature-"]').hide(), 
     i = 0; 
    (function cycle() { 
     divs.eq(i).fadeIn(400) 
      .delay(5000) 
      .fadeOut(400, cycle); 
     i = ++i % divs.length; 
    })(); 
});  
</script> 

pour faire défiler quelques divs, pour faire ils se fondent et disparaissent dans une sorte de diaporama au hasard. Je voudrais randomiser l'ordre affiché sur le chargement de la page, par exemple en ce moment il montre feature-1, puis feature-2, puis feature-3. Comment puis-je l'obtenir pour randomiser cet ordre, comme parfois onload montrera feature-3, feature-1, feature-2, et parfois il montrera feature-2, feature-1, feature-3, etc etc J'ai essayé de créer un tableau puis randomiser les nombres entre 1 et 10 et les placer dans les indices 0-9, mais je ne pouvais pas l'afficher du tout après avoir essayé. Voici un jfiddle pour montrer ce qu'il fait.

http://jsfiddle.net/gthes/

Répondre

1

Utilisez Math.Random()

http://www.w3schools.com/jsref/jsref_random.asp

Exemple: nombre aléatoire de 1 à 6

$(document).ready(function() { 
    var divs = $('div[id^="feature-"]').hide(), 
     i = 0, 
     lastIndex=-1; 
    (function cycle() { 
     do{  
      i = Math.floor((Math.random()*6));  
     }while(i==lastIndex); 

     divs.eq(i).fadeIn(400) 
      .delay(5000) 
      .fadeOut(400, cycle);  

     lastIndex=i; 

    })(); 
}); 
+0

Ce fait a été seulement 2, puis je l'ai enlevé le +1 à la fin du calcul aléatoire, maintenant il randomise. Comment puis-je l'empêcher de répéter des numéros d'affilée, tels que 1 et 1 à nouveau? – salty

+0

@Frits j'ai répondu en premier! XD – DmitryK

+1

@DmitryKvochkin: Oui, mais votre réponse initiale était simplement "Utiliser Math.Random" (sic), qui était de peu de valeur.Cette réponse révisée a une valeur, autre que curieusement toujours en supposant six divs ... –

1
$(document).ready(function() { 
    var divs = $('div[id^="feature-"]').hide(), last_index = false; 

    function get_random_index(max) { 
     return Math.floor(Math.random() * max); 
    } 

    function cycle() { 
     var i; 
     do { 
      i = get_random_index(divs.length); 
     } while (i === last_index); 
     last_index = i;  
     divs.eq(i).fadeIn(400).delay(5000).fadeOut(400, cycle); 
    } 
    cycle(); 
}); 
+1

s'il choisit au hasard qui a déjà disparu dans? –

+0

@TJCrowder Bon commentaire, le code des règlements ultérieurs, maintenant prend toujours un autre. Ce – Halcyon

+0

continue à se briser jsFiddle, je vais essayer live ... edit: oui, il arrête d'afficher après le premier div, et puis il est juste vide – salty

Questions connexes