Mostrar fotos en un div

wanamingo2 · #1 (**permalink**) 31/10/2014, 09:04

Tengo el script que funciona, muestra una foto (que se actualiza cada 5 segundos).

En "localhost" funciona perfecto, pero en el servidor web (mas lento) la foto se carga demasiado despacio y el efecto es malo. (ver ejemplo pruebas.chatin.tv/test3/).

Necesito de alguna forma precargar (preload) la foto antes de que jquery la muestre. Cualquier ayuda sera bienvenida.

Este es el código:

index.html

Código HTML:

Ver original<?php
   
    $room="kalimero";
   
?>
 
<html>
    <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
<link type="text/css" rel="stylesheet" href="style.css" />
<script type="text/javascript" src="myjquery.js"></script>
    </head>
   
<body>
 
 <!--div update every 5 sec-->
    <div id="contenido">
        <img src="loading1.gif">    
    </div>
 
 
 <!--script jquery-->
 <script type="text/javascript">
 
 $(document).ready(function(){
        setInterval(load_ordenar,5000);            
});
 
function load_ordenar(){
 
 $.post("ordenar.php",{aroom:"<?php echo $room; ?>"},function(result){
    $("#contenido").html(result);
  });
}
 
</script>
 
</body>
</html>

ordenar.php

Código PHP:

  <?php 
 
 
$roomis = $_POST['aroom']; 
$naleatorio= mt_rand(5, 4000); 
$directorio = "images/".$roomis."/"; 
$directorio2 = "images/".$roomis."/".$roomis.".jpg?t=".$naleatorio; 
 
echo $directorio2; 
echo '<br>'; 
   
                echo '<img src="'.$directorio2.'" >'; 
 
?>

Gracias por la ayuda!!!

andresgarciadev · #2 (**permalink**) 31/10/2014, 17:51

un ajax cada 5 segundos... y te trae todo un html... no me parece raro que pase eso
seria bueno si en un solo ajax traes una lista de todas las imagenes que quieres se muestren y de hay un jquery que solo cambie el attr src de la imagen cada cierto tiempo no todo el html