duda sobre el manejo de imágenes???

Lizpi · #1 (**permalink**) 30/05/2008, 23:25

hola,

estoy haciendo una web donde tengo q' colocar muchas imágenes, pienso colocarlas en tablas para q queden de un solo tamaño y en pequeño y estas me enlacen a la grande pero me gustaría saber si hay una forma de hacer q' éstas (las img) se vean en grande con solo poner el cursor sobre ellas? esto se puede con HTML?????????????? si se puede, como????????????????????

lo q' no quiero es q' cada q' quiero ver las imágenes me enlace a otra pág. x cada una de ellas

soy novata en esto xfis ayuda q' es una tarea con un ing. muy cruel

pateketrueke · #2 (**permalink**) 31/05/2008, 00:34

necesitas alguna funcion de Javascript... es un tema de Javascript, bye!

00siete · #3 (**permalink**) 31/05/2008, 01:27

Efectivamente eso se hace con Javascript.
En ésta página encontrarás bastantes ejemplos, aunque la mayoría son haciendo click sobre la imágen: http://www.dynamicdrive.com/dynamicindex4/indexb.html

Es bastante popular el Lightbox, y a mi también me gusta la flexibilidad del Facebox

Otra posibilidad, si quieres hacer que se vea con solo poner el razon encima de la imagen pequeña, sin hacer click, es usar la librería overlib. Yo la he usado y tambien es bastante flexible, aunque requiere unos conocimientos mínimos de HTML.

Lizpi · #4 (**permalink**) 31/05/2008, 08:52

ah!! q' látima pk solo me dejan usar html si uso cualquier otro me restarán nota

pero mil gracias x explicarme q' es una duda q' tenía desde hace mucho, asi q' a la próx lo aplicaré claro tendré q' aprender Javascript primero ^_^

gracias ;)

00siete · #5 (**permalink**) 31/05/2008, 11:16

Cita:

Iniciado por Lizpi

ah!! q' látima pk solo me dejan usar html si uso cualquier otro me restarán nota

pero mil gracias x explicarme q' es una duda q' tenía desde hace mucho, asi q' a la próx lo aplicaré claro tendré q' aprender Javascript primero ^_^

gracias ;)

No te ofendas, pero deberías cuidar tu ortografía. Esto no es un mensaje SMS con caracteres limitados, ni un messenger entre amiguetes, es algo que ve mucha gente: http://www.forosdelweb.com/f74/impor...grafia-466695/

Lizpi · #6 (**permalink**) 31/05/2008, 13:25

Lo siento es la mala costumbre, pero gracias lo tomaré muy en cuenta ;).

Lizpi · #7 (**permalink**) 31/05/2008, 13:37

bueno no sé si puedo hacer otra pregunta aqui mismo :?

pero tengo otro problemita y es que al colocar una imágen con enlace me aparece con un marco como se ve en la imágen

como puedo quitarselo no quiero que aparezca porque se ve muy mal, creí que con el link="name" y vlink="name" podría solucionarlo pero me aparece lo mismo, es decir si doy clik en uno todos se enmarcan.

Omura · #8 (**permalink**) 31/05/2008, 13:59

Lo de mostrar la imagen con solo pasar el puntero del mouse encima como te dijeron antes se hace con JavaScript con OnMouseOver y OnMouseOut, también con CSS, entre otras opciones, solo con HTML hasta donde se no se puede, a menos que quieras que al darle clic sobre la imagen pequeña te muestre la imagen grande pero en la misma ventana, eso si es HTML simple y puro.

Raulmmmm · #9 (**permalink**) 31/05/2008, 14:14

Para tu segunda duda, y si no puedes usar otro lenguaje que HTML, pon el atributo border="0" a tu etiqueta <img>.

Lizpi · #10 (**permalink**) 31/05/2008, 14:35

Muchas Gracias por su ayuda

Lizpi · #11 (**permalink**) 02/06/2008, 17:48

00siete,

respecto a la página que me recomendaste donde está lo del Lightbox y el Facebox, es muy bueno y me gustaría hacerlo con cualquiera de esos(el más fácil) pero lamentablemente no sé de javascript y ya me he bajado todo, he tratado de seguir los pasos q' ahi indica pero tengo mil dudas y si no es mucha molestia... ¿Podrías ayudarme?

entre mis dudas son las siguientes:

el código del primer paso

<link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox.js"></script>

bien sé q' tengo q' colocarlo dentro de <HEAD> pero el siguiente paso no comprendo bien como debo hacerlo

2: Create your "thumbnail" HTML code. Three basic flavours are supported:

<a href="dog.jpg" rel="lightbox" ><img src="dog_thumb.jpg" /></a>

-¿Cómo es q' la imagen de "dog.jpg" se vuelve pasa a "dog_thumb.jpg"? solo se le agrega el thumb o hay q' hacer otra cosa?

-¿Dónde introduciré este código exactamente? en <BODY>? siempre dentro de HEAD? o donde?

-¿Dónde coloco lo q' está en el zip q' dice q' hay q' bajar? en C:\Archivos de programa\Java\jre1.6.0\lib? o donde?

si alguien puede explicarme por favor o si hay un tutorial q' explique paso a paso agradeceré su ayuda

gracias

Mikmoro · #12 (**permalink**) 02/06/2008, 18:34

Mira un secillito ejemplo para lo de ver las fotos más grandes al pasar el ratón, sólo con css:

http://www.araudi.net/forosdelweb/fotos.html

A ver si te gusta.

Mikel.

pateketrueke · #13 (**permalink**) 02/06/2008, 19:20

esta wenon.... Mikel.... podrias hacerlo sin porcentaje.... como decirte, deja te explico....

ves que hay una funcion de corte de imagenes.... "crop" creo se le dice.... imaginemos que lo que ves (en reducido) solo es el area central.... digamos, de un bloque de 3x3 .... y justo cuando el mouse pasa encima... generar el mismo efecto pero sin escalar....

vaya, solo eliminando el area de crop... (creo que tambien son CSS) se puede, ¿lo has echo??? seria genial saber como.... deveras!!! :)

Lizpi · #14 (**permalink**) 04/06/2008, 22:50

funciona muy bien ;D era justo lo q' llegué buscando y ahora tengo muchas más opciones ^_^

gracias a todos