entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

1voto

mostrar imagenes de una carpeta en la misma pagina desde un enlace

no estoy seguro si es posible pero quiero que cuando se pulse un enlace me devuelva todas las imagenes de mi directorio luego cuando se pulse otro enlace que estas imagenes den lugar a las nuevas imagenes y asi cada vez que abro un nuevo enlace, todo eso deberia de pasar en la misma pagina en un apartado de mi pagina al costado de mi menu
lo he intentando de varias maneras pero ninguna me resulta


 <nav id="menu-vertical">
    <ul>
        <li><a href="<?php foreach ( glob("*.jpg") as $file) {
            echo include("clothes/$file");

        } ?>">clothes</a></li>
        <li><a href="<?php echo '<img src='include('clothes/jacket.jpg');.'>' ?>">madone2012</a></li>
        <li><a href="">verano2012</a></li>
        <li><a href="">verano2013</a></li>
    </ul>
 </nav>

1 Respuesta

2votos

cobasESP Puntos19430

Si he entendido bien, tienes un apartado con enlaces, y un apartado donde cargas imágenes, cuando pulsas un enlace cargas las imágenes y cuando pulsas otro, las que ya había se reemplazan por otras, correcto?

Bien pues esto tienes tienes que hacerlo con jQuery, ya que la página carga dinámicamente sin moverse de la misma.

Si no sabes muy bien jQuery te dejo una plantilla aqui para que veas como tiene que ser la estructura:

<script>
$('#enlace1').click(function(){
  var image1 = '<img src=clothes/jacket.jpg />';
  var image1 = '<img src=clothes/jacket2.jpg />';
  // etc etc

  $('#contenido').html(image1+image2);
});

</script>

Con este código al hacer clic en cualquier sitio con la id "enlace1" cargara esas dos imagenes o las que tu quieras poner. Aunque lo suyo sería que recogieses de una base de datos que productos debe haber con sus respectivas imagenes y los cargues todos de una.

steven comentado Mar 14

la idea es recuperar las imagenes del database lo tengo almacenado en mi tabla con sus respectivas rutas asi cada vez que subo una nueva imagen ser carga dinamicamente que se podria hacer en este caso

cobasESP comentado Mar 14

Lo suyo sería tener una tabla con el nombre de todas las imagenes, cuando alguien pinche en un enlace por ejemplo... "chaquetas", mandar una petición ajax con el nombre chaquetas a un script en PHP, ese script te busca todas las chaquetas y te devuelve el nombre de la imagen, crear el codigo <img src="..."> correspondiente y metes todo en una variable, ajax, a la vuelta recibirá ese código y tu simplemente lo imprimes en la pantalla:

var tipo; //aqui metemos la variable que queramos depende de donde hayamos dado clic
$.ajax({
        url : 'traerfotos.php?tipo='+tipo,
        type : 'GET',
        dataType:'html',
        complete : function(data) {
           //la funcion complete comienza cuando ajax ha terminado una petición http
           console.log(data);//Imprimo el objeto que contiene los datos por consola

           $('contenido').html(data.responseText); //con responseText cogemos solo los datos en html de las imagenes.

        }
});

Aplica este código al que te he puesto anteriormente, solo que al hacer clic en un enlace, en vez de mostrar esas imágenes llamas a esta función ajax completa, ya solo te quedaría tener el script PHP, como no se como es tu base de datos omitire las llamadas a consulta SQL.

$tipo = $_GET['tipo'];

//hacemos un select * from, de la tabla que sea del tipo "chaqueta" 
//Hacemos un bucle while para recorrer todas las chaquetas y cogeremos en cada chaqueta su nombre de archivo
$contenido = ''; //Aqui guardamos todo el codigo de imagenes

while(//haya elementos en el array){
  $contenido = $contenido.'<img src="'.$array[0]->imagen.'">';
}

//Despues mandamos un echo para devolverlo
echo $contenido;

Esto lo he hecho un poco con pseudo código ya que no se como tienes montado la bd pero mas o menos te haces una idea, vas creando el codigo para mostrar imagenes con todas las que saques de la tabla, y con un echo pasas toda la variable ya montada a la web, y la funcion complete de ajax te termina el trabajo imprimiendo todo eso donde quieras.

Espero no haberte liado mucho y que te sirva :)

steven comentado Mar 14

gracias por el consejo, que lastima que no se pueda mandar a llamar las imagenes embebiendo codigo php dentro del atributo src, sin embargo como dices tu es necesario usar ajax para no recargar la pagina, el problema es que no se manejar muy bien jquery, prefiero hacerlo con puro js asi en futuro no hay problemas ya que la libreria jquery cambia frequentemente de sintaxis y eso me puede costar rescribir todo de cero

Por favor, accede o regístrate para responder a esta pregunta.

¿Conoces alguien que puede responder?
¡Comparte esta pregunta!


Actividad Reciente

¿Eres Usuario Apple?

...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta