Pop up desde imagen y/o texto
Estoy armando un sitio educativo donde habrá textos e imágenes.
La idea es poder ampliar las fotos en ventanas pop up.
Los vínculos a los pop up estarían tanto en las fotos como en la parte del texto donde se hace referencia a esa imagen.
Desde la foto no tengo problema utilizando el Comportamiento "Abrir ventana del navegador", pero se complica cuando debo hacer el vínculo desde el texto, ya que no lo abre en pop up.
Por favor, ¿me explicas cómo hacerlo? No entiendo mucho de javascript, pero me atrevo a intentarlo!
Muchas gracias,
Galabriela.
(Ejemplo: En la web hay un texto de estudio y fotos ilustrativas.
En una parte del texto dice "... El cuadro Los Girasoles de Van Gogh...". Esta parte del texto sería un vínculo al cuadro Los Girasoles en pop up.
En la página también hay una fotito del cuadro, que también sería un vínculo para ver Los Girasoles en pop up)
La idea es poder ampliar las fotos en ventanas pop up.
Los vínculos a los pop up estarían tanto en las fotos como en la parte del texto donde se hace referencia a esa imagen.
Desde la foto no tengo problema utilizando el Comportamiento "Abrir ventana del navegador", pero se complica cuando debo hacer el vínculo desde el texto, ya que no lo abre en pop up.
Por favor, ¿me explicas cómo hacerlo? No entiendo mucho de javascript, pero me atrevo a intentarlo!
Muchas gracias,
Galabriela.
(Ejemplo: En la web hay un texto de estudio y fotos ilustrativas.
En una parte del texto dice "... El cuadro Los Girasoles de Van Gogh...". Esta parte del texto sería un vínculo al cuadro Los Girasoles en pop up.
En la página también hay una fotito del cuadro, que también sería un vínculo para ver Los Girasoles en pop up)
2 respuestas
Respuesta de masterlui
1
Aquí tengo un código que es tu solución
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<script language="JavaScript">
<!--
function openWindow(url, name) {
popupWin = window.open(url, name, 'scrollbars,resizable,width=700,height=500')
}
// -->
</script>
<body>
<center><a HREF="javascript:openWindow('default.asp', 'minichat',700,600);"> Entrar al chat </a><br></center>
</body>
</html>
Reemplaza default.asp por la página donde tendrás la foto más grande
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<script language="JavaScript">
<!--
function openWindow(url, name) {
popupWin = window.open(url, name, 'scrollbars,resizable,width=700,height=500')
}
// -->
</script>
<body>
<center><a HREF="javascript:openWindow('default.asp', 'minichat',700,600);"> Entrar al chat </a><br></center>
</body>
</html>
Reemplaza default.asp por la página donde tendrás la foto más grande
Respuesta de teocoruna
1
Efectivamente, necesitas javascript para todas ellas, y lo habitual cuando no sabes programar en dicho lenguaje es directamente acudir a un lugar especializado y copiar el código que te ofrecen para efectuar la función que deseas. Puedes elegir además, si son varias las fotos que quieres ampliar, que se abran todas en el mismo popup, de manera que el navegante no tenga que estar abriendo y cerrando ventanas constantemente. Te recomiendo dos: http://www.javaboutique.com (inglés) y http://www.codigo-web.com (español).
Busca en ambos las entradas correspondientes a la palabra popup lee todo atentamente porque encontrarás secciones de código que debes incrustar (copiar/pegar) en el cuerpo de la página origen y otras en la cabecera de la página destino.
Busca en ambos las entradas correspondientes a la palabra popup lee todo atentamente porque encontrarás secciones de código que debes incrustar (copiar/pegar) en el cuerpo de la página origen y otras en la cabecera de la página destino.