Autor Tema: Poner una imagen que enlace a otra de mayor tamaño  (Leído 69185 veces)

Colegota

  • Palizas oficial
  • *
  • Mensajes: 8188
  • ¡Me faltan carretes!
    • ¡Me faltan carretes!
Poner una imagen que enlace a otra de mayor tamaño
« on: 24 feb 2005, 12:17 pm »
A veces una imagen tiene suficiente detalle como para que reducirla, aunque sea a 700 puntos de ancho, nos resulte algo pequeña. Pero incluir una imagen de tamaño mayor sería contraproducente debido a que la visualización de la página no permitiría poder contemplar la imagen completa.
Una alternativa consiste en poner en el foro una imagen no muy grande y permitir que si el usuario pincha en la misma se le abra una ventana nueva con la foto a tamaño mayor.

En El Almacén de Fotografía Libre y en páginas similares normalmente tenemos más de una versión de cada imagen presentadas a diferentes tamaños según para qué tipo de visualización.
Lo único que necesitaremos saber son las url o direcciones de cada una de las imágenes y el resto lo haremos con los iconos del editor.

En el caso de www.fotolibre.org si se ha subido una imagen de tamaño mayor a 750 pixeles de ancho, nos habrá generado una intermedia de dichas dimensiones a la que llama con el mismo nombre de archivo, pero comenzando por "normal_".
Esta imagen "normal" es la que verán los visitantes de la galería por defecto, y si pinchan con el ratón en ella, se les abrirá una ventana nueva con la imagen a tamaño original.

Para saber la dirección o url de la imagen, todos los navegadores tienen opciones en el botón derecho del ratón del tipo "Copiar la ruta de la imagen", aunque en Internet Explorer es un poco más complicado porque requiere usar la opción de Propiedades y si la url es muy larga a veces se corta.

Una vez con las url'es en el portapapeles venimos al editor y las "pegamos" .

En nuestro ejemplo las direcciones de las imágenes son:
http://www.fotolibre.org/albums/userpics/10002/navacerrada-arboles-c01-f.jpg la grande y
http://www.fotolibre.org/albums/userpics/10002/normal_navacerrada-arboles-c01-f.jpg la intermedia.
(recuerda que en las url del Almacén siempre es necesario poner las www)

Estos son los pasos a seguir:

Seleccionamos la url "normal" y pinchamos el botón de Insertar Imagen (), con lo que obtenemos el siguiente código:

Código: [Seleccionar]
[img]http://www.fotolibre.org/albums/userpics/10002/normal_navacerrada-arboles-c01-f.jpg[/img]
Ahora seleccionamos la línea completa y pinchamos en el botón de Insertar hipervínculo (). Nos deja este texto:

Código: [Seleccionar]
[url][img]http://www.fotolibre.org/albums/userpics/10002/normal_navacerrada-arboles-c01-f.jpg[/img][/url]
A continuación de la primera vez que aparece la palabra "url", añadimos un signo de = (igual) y la url de la imagen a tamaño completo. Esto es:

Código: [Seleccionar]
[url=http://www.fotolibre.org/albums/userpics/10002/navacerrada-arboles-c01-f.jpg]
[img]http://www.fotolibre.org/albums/userpics/10002/normal_navacerrada-arboles-c01-f.jpg[/img][/url]

Y para terminar de dejarlo vistoso, volvemos a seleccionar todo y pinchamos el botón de Centrado ():

Código: [Seleccionar]
[center][url=http://www.fotolibre.org/albums/userpics/10002/navacerrada-arboles-c01-f.jpg]
[img]http://www.fotolibre.org/albums/userpics/10002/normal_navacerrada-arboles-c01-f.jpg[/img][/url][/center]

Una vez que pinchemos en Previsualizar o veamos el mensaje una vez publicado, el resultado será:


En otros sistemas, en que disponemos de diferentes tamaños de imágenes, lo único que necesitamos es conseguir la url de cada una de ellas y el resto es exactamente idéntico.

Miniaturas

Otra posibilidad es la de presentar miniaturas, aunque sólo recomendable para casos muy concretos. El proceso es exactamente el mismo que el anterior pero cambiando la imagen base (la "normal") por la miniatura que nos ha generado El Almacén o sistema equivalente.

En nuestro caso las miniaturas tienen el nombre de la imagen original pero comenzando por "thumb_", es decir:
http://www.fotolibre.org/albums/userpics/10002/thumb_navacerrada-arboles-c01-f.jpg

Si hacemos la correspondiente sustitución en el código anterior tenemos:
Código: [Seleccionar]
[center][url=http://www.fotolibre.org/albums/userpics/10002/navacerrada-arboles-c01-f.jpg]
[img]http://www.fotolibre.org/albums/userpics/10002/thumb_navacerrada-arboles-c01-f.jpg[/img][/url][/center]

que aparece cómo

Nótese que lo que se ha sustituído es la imagen, no el hipervínculo.
« Última Modificación: 21 mar 2005, 13:12 pm por *FotoLibre* »
[Canon EOS 50 40D (sin diapos ni nada)] [Escáner Minolta DSE 5400] [Vuescan] [El GIMP] [Galería] [Página de Viajes]

Quo Vadis

  • Veteran@
  • *****
  • Mensajes: 907
Re: Poner una imagen que enlace a otra de mayor tamaño
« Respuesta #1 on: 06 mar 2008, 12:44 pm »
Enterado gracias.
Mi cabeza cana, los años perdidos,
quiero hallar los viejos, borrados caminos.
Nunca fui a Granada,
nunca fui a Granada.

R. Alberti

gecko

  • Veteran@
  • *****
  • Mensajes: 492
    • A un "clic" de la realidad
Re: Poner una imagen que enlace a otra de mayor tamaño
« Respuesta #2 on: 06 mar 2008, 17:05 pm »
Lo de las miniaturas no sabía como hacerlo. Gracias.

Saludos

albertoliberto

  • Comenzando
  • *
  • Mensajes: 2
Re: Poner una imagen que enlace a otra de mayor tamaño
« Respuesta #3 on: 27 ago 2014, 17:56 pm »
yo no tengo ni idea,escribo este mensaje porke creo k asi activare mi perfil,un saludo atodos

kallh

  • Bimilenari@
  • **
  • Mensajes: 2242
Re: Poner una imagen que enlace a otra de mayor tamaño
« Respuesta #4 on: 28 ago 2014, 04:01 am »
yo no tengo ni idea,escribo este mensaje porke creo k asi activare mi perfil,un saludo atodos

Hola albertoliberto,

Ya que te has puesto y si era para activar el perfil (aunque no creo que sea necesario escribir un mensaje para hacerlo, los de la "sala de máquinas" nos pueden decir mejor al respecto), podrías hacerlo en el subforo de presentaciones, y así te presentas en sociedad de forma más ortodoxa y matas dos pájaros de un tiro.  ;)

Y sobre lo de no tener ni idea, pregunta exactamente qué es lo que no entiendes y te ayudamos a aclararlo.

Saludos,

Andoni