Un solo hipervinculo, varias imagenes

juanete50 · #1 (**permalink**) 23/04/2015, 10:57

Hola, les cuento que estoy tratando de armar a ver si alguien me ayuda!
Tengo una lista grande en excel, de productos, y mi idea es ponerle un link a una imagen del producto. Lo que quería hacer es poner un hipervínuclo a cada articulo y que eso me abra una html...

El tema es que yo quiero hacer solo 1 html y que dependiendo el link que presiono, me abra en ese html la imagen correspondiente, ejemplo:

ART 1 - ·%$·!"$$%&·&.
cuando presiono sobre "ART 1" en productos.html, quiero que me aparezca la foto art1.jpg

ART 2 - ·$"%·$"%·$"%
cuando presiono sobre ART 2 en productos.html, quiero que aparezca solo la foto art2.jpg

y así sucesivamente, de esta manera me ahorro de hacer 100 htmls por cada producto... seria como Anclaje, pero no quiero todas las fotos, solo que se cargue la foto del articulo seleccionado!

nose si me explico

muchas gracias por la ayuda!!!
abrazo

Alexis88 · #2 (**permalink**) 23/04/2015, 11:22

En el hipervínculo, pasa el nombre de la imagen y su ruta y en la página, toma dicho valor desde la URL y muestra la imagen.

Código La URL:

Ver originalejemplo.html?variable=valor

Código Javascript:

Ver originalvar query = document.URL.split("?")[1], //variable=valor
    imagen = query.split("=")[1]; //valor
 
document.querySelector("#id del elemento <img>").src = imagen;

Saludos

juanete50 · #3 (**permalink**) 24/04/2015, 00:11

Gracias Alexis por tu respuesta,
mucho no entendi ya que de jquery no manejo mucho el tema!
pero intentare!!
gracias por tu tiempo

un abrazo

juanete50 · #4 (**permalink**) 14/05/2015, 16:37

Alexisis, como andas?
sabes que no logre armarlo...
no soy muy aficionado del jquery entiendo pero de verlo...

si no es molestia podrias explicarmelo más con un ejemplo concreto?
desde ya, muchisimas gracias
y saludos!

Alexis88 · #5 (**permalink**) 14/05/2015, 20:01

Lo primero debe de ir en un enlace:

Código HTML:

Ver original<a href = "ejemplo.html?variable=valor">Enlace</a>

Y lo segundo, como script del archivo 'ejemplo.html'.

Código HTML:

Ver original<!DOCTYPE html>
<html lang="es">
<head>
    <title>Ejemplo</title>
</head>
<body>
    <!-- Aquí irá el contenido de la página -->
    <script type="text/javascript">
        //Aquí debe de ir el código JavaScript que te dejé en mi anterior respuesta
    </script>
</body>
</html>

Saludos