Ver Mensaje Individual
  #15 (permalink)  
Antiguo 19/10/2012, 13:20
Avatar de emprear
emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 5 meses
Puntos: 1567
Respuesta: [APORTE] rotador aleatorio sin repetición pocas imágenes

Creo que estamos en uno de esos casos en los que la función debe de ser ajustada al objetivo a lograr. Aquí la universabilidad no cabe.
Las funciones que se han mostrado funcionan bien, algunas más optimizadas que otras, pero todas cumplen su cometido
Hacer un random sin repetición, de acuerdo, pero para que?
Dos casos típicos,
el reparto de una baraja, las cartas se reparten al azar y obviamente no puede haber 2 cartas iguales
un sorteo (con premios del uno al diez) en los que obtenemos 10 ganadores, con numeros que no pueden repetirse
Pero aquí se partió de un ejemplo aplicado al uso de baners rotativos, que deben ser distribuidos equitativamente en la presentación, ya no estamos hablando de un array que se mezcla y recorre al azar tan solo una vez (las cartas vuelven al mazo para ser mezcladas una vez terminada la partida) sino que estamos repitiendo el ciclo. Podemos como mucho solucionar el problema de que el primer banner del 2º ciclo sea el mismo que el último del 1º. En ese contexto lograr una "equidad" completa en la muestra de los banners es practicamente imposible, esta solo será conseguida si los mismos se muestran secuencialmente en el orden original.
Me pregunté entonces cual sería la mejor opción a utilizar en este caso, es decir para crear un rotador aleatorio sin repetición pocas imágenes (o muchas, sería lo mismo), y mantener la distribución "equitativa", que es el punto fundamental. Sin desmerecer para nada los excelentes trabajos que han expuesto, sencillamente, mezclaría nuestro array de imágenes al cargar la página y luego lo recorería sin volver a mezclarlo, una y otra vez

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <title>Cambiar banners</title>
  5. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  6. <script type="text/javascript">
  7. //<![CDATA[
  8. var mezclar = function(n){
  9. for(var j, x, i = n.length; i; j = Math.floor(Math.random() * i), x = n[--i], n[i] = n[j], n[j] = x);
  10. return n;
  11. }
  12.  
  13. var banners = ['1', '2', '3', '4', '5', '6', '7'];
  14. mezclar(banners);
  15. var banner_actual = 0;
  16. var Cambiar = function(){
  17.     var p= "";
  18. if (banner_actual == banners.length) {
  19. banner_actual = 0;
  20. }
  21. var cambio =banner_actual++;
  22. if(cambio === 6){
  23. p = "<br \/>";
  24. }
  25. document.getElementById('banner').innerHTML +=  banners[cambio] + '<br \/>' +  p;
  26. var t = setTimeout(Cambiar, 1000);
  27. }
  28. window.onload = Cambiar;
  29. //]]>
  30. </head>
  31. <div id="banner"><!-- banners --></div>
  32. </body>
  33. </html>


Espero se entienda la idea
Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.

Última edición por emprear; 19/10/2012 a las 13:45