cambiar imagenes aleatoriamente

WinderJerter · #1 (**permalink**) 21/04/2012, 21:44

Hola que tal, tengo un problema y quería ver si alguien me puede ayudar a resolverlo.

Bueno, lo que pasa es que quiero mostrar una galería de 30 imágenes y que se vallan cambiando las imágenes por separado y aleatoriamente y esto trato de lograrlo de la siguiente manera:

Código php: imagenes.php

Código PHP:

Ver original<?php
 
require_once("base_de_datos.php");
 
$sql = "SELECT * FROM imagenes ORDER BY RAND() LIMIT 30";
$result = mysql_query($sql);
 
while($img = mysql_fetch_assoc($result)) {
    echo "<a href=\"web.com/preview.php?id=".$img['id']."\"><img src=\"".$img['url']."\" height=\"75\" width=\"75\"></a>\n";
}
 
?>

Y la siguiente es la pagina donde quiero que se muestre la galería:

Código HTML:

Ver original<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
 
<script>
function reload() {
        $("#gallery").load("imagenes.php", function() {
            $("#gallery").fadeOut("8000", function() {
                $("#gallery").fadeIn("4000");
            });
        });
}
 
setInterval("reload()", 12000);
</script>
</head>
 
<body>
 
<div id="gallery"></div>
 
</body>
</html>

La verdad no tengo casi conocimientos en jquery, el código lo hice con lo poco que se y el problema esta en que se recargan todas las imágenes y estoy consiente de que eso sucede porque estoy recargando toda la pagina, pero no encuentro la forma de cambiar las imagenes por separado

Si alguien me pudiera ayudar se lo agradecería demasiado.

Saludos y gracias de antemano