Ver Mensaje Individual
  #6 (permalink)  
Antiguo 08/05/2012, 10:10
elleviatan
 
Fecha de Ingreso: mayo-2012
Mensajes: 28
Antigüedad: 11 años, 11 meses
Puntos: 0
Respuesta: Precargar carpeta de imagenes.

No es solo un codigo, es una carpeta con varios archivos (2 php y una carpeta con imagenes). Lo he añadido porque me parecia la manera mas facil de que alguien me pudiera ayudar.

El codigo esta en mi primer post (en un enlace a un tutorial) que he tratado de seguir con los siguientes pasos:

Un index.php con el siguiente codigo:

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script type="text/javascript">
/* JavaScript Component */
 
function preloadImagesFromDirectory(dir) {
 
    if(!dir) return;
 
    function getJSON(URL,success){
 
        // Create new function (within global namespace)
        // (With unique name):
        var uniqueID = 'json'+(+(new Date()));
            window[uniqueID] = function(data){
                success && success(data);
            };
 
        // Append new SCRIPT element to DOM:
        document.getElementsByTagName('body')[0].appendChild((function(){
            var script = document.createElement('script');
            script.type = 'text/javascript';
            script.src = URL.replace('callback=?','callback=' + uniqueID);
            return script;
        })());
 
    }
 
    function preload(srcArray) {
        for(var i = 0; i < srcArray.length; i++) {
            (new Image()).src = srcArray[i];
        }
    }
 
    // Get that JSON data:
    getJSON('scanImageDirectory.php?directory=' + encodeURIComponent(dir) + '&callback=?', function(data){
        return data.images ? preload( data.images ) : false;
    });
 
}
//
// We don't want to disturb anything so we'll wait
// until everything's done loading before preloading:
window.onload = function(){
    preloadImagesFromDirectory('images/');
}
  
</script> 
</head>

<body>
</body>
</html>
Y un php aparte (scanImageDirectory.json.php) con este otro codigo:


Código:
<?php
/* PHP file, e.g. scanImageDirectory.json.php */
 
// Check that a callback function has been specified:
if (!isset($_GET['callback']) || !isset($_GET['directory'])) exit;
 
// Use PHP5's scandir function to scan all

// of images directory:
$dirContents = scandir($_GET['directory']);
 
// Define function to confirm each
// filename is a valid image name/extension:
function isImageFile($src) {
    return preg_match('/^.+\.(gif|png|jpe?g|bmp|tif)$/i', $src);
}
 
// Loop through directory files and add to
// $arrayContents on each iteration:
$arrayContents = '';
foreach($dirContents as $image) {
    if (isImageFile($image)) {
        $arrayContents .= !empty($arrayContents) ? ',' : '';
        $arrayContents .= '"' . 'images/' . $image . '"';
    }
}
 
// Prepate JSON(P) output
$output = $_GET['callback'] . '({\'images\':[' . $arrayContents . ']});';
 
// Output the output:
echo $output;
?>
Junto a estos php hay una carpeta images (con varias imagenes en su interior)


Asi es como yo he entendido el tutorial del cual pongo el enlace en mi primer post.
Pero no se si he hecho los pasos de manera correcta.

Agradeceria alguien pudiera ayudarme.

Un saludo