[Tutorial] Medio - Clic a imagen y abre en grande

Ayudas para los usuarios principiantes; y que ubicarán fácilmente en este subforo.

ModeradorCOLON Moderadores

Avatar de Usuario
Ivan
Master User
Master User
MensajesCOLON 2172
RegistradoCOLON 29 Oct 2005 00:15
UbicaciónCOLON Santa Fe, Argentina
CONTACTCOLON

[Tutorial] Medio - Clic a imagen y abre en grande

Notapor Ivan » 20 Jun 2009 19:44

Clic y PAF!

He estado leyendo en varios posts que muchos usuarios necesitan que al cliquear
en una de sus imágenes, estas se abren pero más grandes. Existen códigos más difíciles,
como puede ser LightBox para realizar estos efectos.

Aquí les mostraré cual es la manera más eficiente y simple en HTML: las ventanas Pop Ups.

¿Qué son?
Simples ventanas con contenido html que emergen al entrar a un sitio (como publicidad) o al cliquear en un enlace predeterminado.

¿De qué están formadas?
Principalmente posee un enlace o imagen base. Al cliquear en éste, se abre la ventana.
Esta "ventana" es editable. Pueden quitarle la barra de desplazamiento, la dirección URL
y más propiedades. También hay que destacar la dirección URL de la ventana, por ejemplo
http://perros.com/chihuaha/chiu1.png (dirección inventada)

¿Cómo realizar una propia?
Copia este código y edita lo que te aclaro en rojo.
<script language="JavaScript">
function Abrir_ventana (pagina) {
var opciones="toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=ancho en píxeles, height=alto en píxeles, top=0,

left=0";
window.open(pagina,"",opciones);
}
</script>
</head>
<body>
<a href="javascript:Abrir_ventana('http://blog.educastur.es/terceroencanal/files/2008/01/cactus-montanero.jpg')"><font size="1"

face="Verdana">Foto Número 1 (cactus.jpg)</font></a>


Toolbar, location, directories, scrollbar, status, menubar, resizable son las propiedades
de la ventana.
Width es ancho de ventana y height es altura de la ventana (todo en píxeles).
Left y top son las coordenadas de donde aparece la ventana (0;0 significa que aparece
arriba a la izquierda).
Debes cambiar la URL de la ventana.
"Foto Número 1" es el enlace donde puede ir una imagen (<img src="miimagen.png">)

Klk3
ExAdministrador
ExAdministrador
MensajesCOLON 2803
RegistradoCOLON 18 Nov 2005 16:09
UbicaciónCOLON Barcelona,España
CONTACTCOLON

Re: [Tutorial] Medio - Clic a imagen y abre en grande

Notapor Klk3 » 20 Jun 2009 20:44

buena idea pero el bloqueador de pop ups los bloquea ??¿
Imagen
Hasta siempre ha sido un placer muy grande :D

Avatar de Usuario
Ivan
Master User
Master User
MensajesCOLON 2172
RegistradoCOLON 29 Oct 2005 00:15
UbicaciónCOLON Santa Fe, Argentina
CONTACTCOLON

Re: [Tutorial] Medio - Clic a imagen y abre en grande

Notapor Ivan » 20 Jun 2009 21:03

Klk3 escribióColonbuena idea pero el bloqueador de pop ups los bloquea ??¿

lo desactivarían para esa página, no? XD

Klk3
ExAdministrador
ExAdministrador
MensajesCOLON 2803
RegistradoCOLON 18 Nov 2005 16:09
UbicaciónCOLON Barcelona,España
CONTACTCOLON

Re: [Tutorial] Medio - Clic a imagen y abre en grande

Notapor Klk3 » 21 Jun 2009 10:27

ya si es una pagina que la conoces si pero si es la primera vez que entras a esa página tendrían que avisarte los dueños de la webs i no no lo desactivas ni de coña
Imagen
Hasta siempre ha sido un placer muy grande :D

Avatar de Usuario
formuloizer
Grand User
Grand User
MensajesCOLON 487
RegistradoCOLON 16 Jun 2009 19:50
UbicaciónCOLON Palma de Mallorca

Re: [Tutorial] Medio - Clic a imagen y abre en grande

Notapor formuloizer » 21 Jun 2009 13:29

Que bien!! Ya me puedo poner manos a la obra !! :lol:
http://www.formuloizer.tk
Web de Fórmula 1 y Moto GP


Volver a

¿Quién está conectado?

Usuarios navegando por este Foro: 4 y 0 invitados