Generar array dinamico de imagenes

mazaku · #1 (**permalink**) 23/03/2012, 12:53

Buen dia quisiera que me pudieran ayudar porfavor con el siguiente problema tengo este codigo pero quisiera mostrar el array de forma dinamica es decir que haga el array de un directorio donde atraves de una url que le pase por medio de una BD, y no tener que estar poniendo manualmente las imagenes sino que al darle el url del directorio las cree automaticamente.

Código:

<script language="JavaScript1.1">
var photos=new Array()
var which=0

/*Change the below variables to reference your own images. You may have as many images in the slider as you wish*/
photos[0]="immagine01.jpg"
photos[1]="immagine02.jpg"
photos[2]="immagine03.jpg"
photos[3]="immagine04.jpg"
photos[4]="immagine05.jpg"


function backward(){
if (which>0){
window.status=''
which--
document.images.photoslider.src=photos[which]
}
}

function forward(){
if (which<photos.length-1){
which++
document.images.photoslider.src=photos[which]
}
else window.status='End of gallery'
}
</script>

es decir en vez de estar escribiendo manuelmente esto que sea automaticamente

Código Javascript:

Ver original/*Change the below variables to reference your own images. You may have as many images in the slider as you wish*/
photos[0]="immagine01.jpg"
photos[1]="immagine02.jpg"
photos[2]="immagine03.jpg"
photos[3]="immagine04.jpg"
photos[4]="immagine05.jpg"

espero haberme explicado bien

muchas gracias por su ayuda

Panino5001 · #2 (**permalink**) 23/03/2012, 13:13

Necesitás lenguaje de servidor para acceder al sistema de archivos, con javascript no es posible. Un ejemplo en php:

Código PHP:

 
<!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>Documento sin título</title>
<script type="text/javascript">
<?php
//configurar:
$directorio='FotosProductos';
?>
var imgs=['<?php echo implode("','",glob("$directorio/*.{gif,jpeg,jpg,png}", GLOB_BRACE)); ?>'];
alert(imgs[0]);
</script>

</head>

<body>
</body>
</html>

mazaku · #3 (**permalink**) 23/03/2012, 15:20

muchas gracias Panino5001 por tu ayuda he implementado el codigo y me ha funcionado, pero quisiera saber si podrias ayudarme con otro problema, lo que pasa es que quisiera hacer el cambio de imagenes a traves de un select y que este cambie el numero de la imagen en la que se encuentra, tengo el siguiente codigo y quisiera saber si podrias ayudarme a implementarlo con el codigo anterior porfavor.

Código PHP:

Ver original<form name=slideform>
        <div align="right">
          <select name="slide" onChange="change();">
            <?php 
$files = scandir("".$reg['c_path'].""); 
$dir ="".$reg['c_path']."";
 
$c1 = count($files);
$c2 = 1;
for($i=0; $i<$c1; $i++)
{
  if(strlen($files[$i]) > 3)
  {
  $extension = strtolower(substr($files[$i], -4));
    if(($extension == ".gif") OR ($extension == ".jpg") OR ($extension == ".png"))
    {
    echo "<option value='$dir".$files[$i]."'>$c2";
        $c2++;    
    }
  }
  }
 ?>
          </select>
                </form>