2012-02-08 20 views
5

Tengo un conjunto de anuncios gráficos que quiero cambiar el orden de todos los días a la medianoche.Cambiar el orden de las imágenes a la medianoche

Básicamente para que un día será como este

<img src="image1"> 
<img src="image2"> 
<img src="image3"> 
<img src="image4"> 

y al día siguiente se verá como este

<img src="image4"> 
<img src="image1"> 
<img src="image2"> 
<img src="image3"> 

¿Cómo podría lograr esto con javascript, jQuery o PHP. No me preocupa el idioma que uso, solo necesito resolverlo. Gracias ..

+1

Simplemente mantenga el orden en el archivo/base de datos y cámbielo cada medianoche. Alguna pregunta en particular? – zerkms

Respuesta

4

Prueba este http://jsfiddle.net/KQwf2/1/

HTML:

<img src="http://solarpanels2green.com/images/one.gif" title='1'> 
<img src="http://solarpanels2green.com/images/two.gif" title='2'> 
<img src="http://solarpanels2green.com/images/three.gif" title='3'> 
<img src="http://solarpanels2green.com/images/four.gif" title='4'> 

y js código

var all = $('img'), 
     shift = Math.floor(
      (new Date().getTime() - new Date().getTimezoneOffset() * 60000) 
     /(24 * 3600 * 1000)) % all.length; 

all.filter(':gt(' + (all.length - shift - 1) + ')') 
    .insertBefore(all.first()); 

Calcula el MOD de la división del número de días transcurridos desde la medianoche del 1 de enero de 1970 por el número de elementos en la lista de imágenes, toma esta cantidad de imágenes de la parte inferior de la lista y las mueve al frente de la lista.

Actualizado para tener en cuenta la zona horaria del visitante.

+0

Hermosa , ¡Gracias! Gracias a todos los demás también. Las otras soluciones parecen funcionar, pero esto fue demasiado fácil de implementar para dejar pasar. – Zach

+0

@ user1166556 De nada :) De hecho, este 'if (shift! = 0)' también podría eliminarse. Era una tarde de la tarde, así que tuve un 'pensamiento lento') – Cheery

2

Si tiene acceso a una base de datos, sería muy sencillo en php almacenar el pedido todos los días en la base de datos. Luego, cuando se carga la página, usted verifica la fecha de origen y actualiza si no coincide con la fecha actual. El proceso de actualización consistiría en generar un nuevo pedido a través de php's rand.

Si no tiene acceso a una base de datos, tendrá que idear un mecanismo de aleatorización diferente basado únicamente en la fecha. Una opción sería generar un hash de la fecha y usarlo para dirigir su pedido.

He aquí algunos php pseudocódigo de la opción de no-DB:

$fullhash = md5(date("Ymd")); 
$hash = $fullhash; 
$countImages = 4; //or whatever the actual number of images you have is 
$shownImages = array(); 
while ($countShown < $countImages) 
{ 
    $num = ord($hash); //get ascii value of first char of $hash 
    $num = $num % $countImages; //convert the number to something that corresponds to an image 
    if (!(in_array($num, $shownImages))) 
    { 
    echo "<img src='image" . $num . "'>"; 
    $shownImages[] = $num; 
    } 
    $hash = substr($hash,1); 
    if (strlen($hash) == 0) 
    { 
    $fullhash = md5($fullhash); //generate a new hash in case the previous one did not catch all images 
    $hash = $fullhash; 
    } 
} 

Esto podría parecer demasiado complicado. Si puede establecer sistemáticamente una semilla para la generación de números aleatorios en su servidor, entonces puede reemplazar la mayor parte del código anterior con eso. Sin embargo, cada vez más implementaciones se están alejando de los generadores de números aleatorios de siembra usted mismo, lo que hace que sea menos trivial generar repetidamente la misma secuencia de números aleatorios.

0

puede obtener el tiempo con javascript. a continuación, me gustaría crear una matriz, aleatoriamente el orden y la salida de sus imágenes

var d = new Date(); 
var time= d.getHours(); 
if(time>=24){ 
    //code here for randomizing 
} 

http://www.w3schools.com/jsref/jsref_gethours.asp
http://www.javascriptkit.com/javatutors/randomorder.shtml

+0

¿Y qué hacer si 'tiempo <24'? – zerkms

+0

nada, está buscando cambiar el orden si el espectador es después de la medianoche en su computadora –

+1

@tq: 1. No soy OP 2. Necesita leer la pregunta una vez más, no la entendió – zerkms

1

Aquí hay uno en PHP que sólo depende de los tiempos de última modificación de un conjunto de imágenes en un directorio dado:

<?php 

function cmp($a, $b){ 
    $atime = filemtime($a); 
    $btime = filemtime($b); 

    return $atime == $btime ? 0 : ($atime < $btime ? -1 : 1); 
} 

$paths = array(); 

if ($dh = opendir('images')){ 
    while (($path = readdir($dh)) !== false){ 
    if (substr($path, -4) == '.jpg'){ 
     array_push($paths, "images/$path"); 
    } 
    } 
} 

$count = count($paths); 
$offset = time() % $count; 

usort($paths, 'cmp'); 

for ($i = 0; $i < $offset; $i++){ 
    $path = array_shift($paths); 
    array_push($paths, $path); 
} 

?> 

Entonces, siempre que lo necesite en su página:

<?php foreach ($paths as $path): ?> 
    <img src="<?php echo $path; ?>" ... /> 
<?php endforeach; ?> 
Cuestiones relacionadas