Ventana popup o función leer más
Tengo como veis en la foto unos apartados con leer más y lo que tendría que poner de más no es mucho texto con lo que no es factible crear otra página más y pensé que podía hacer una ventana flotante o un sistema que se pueda desplegar y leer más texto como eso que se ve a veces con el símbolo +, pero no se como hacerlo. Probé con lightbox pero no me queda bien.
A ver si podéis ayudarme porque busco por internet pero no doy con ello.
Encontré esto http://www.elcodigofuente.com/ventana-flotante-en-html-432/
pero no me queda bien como se puede ver en la segunda imagen, me convierte en ventana flotante el botón leer más y no me abre la pagina que puse en ventana flotante.
Probé este código
http://soporte.miarroba.es/1364/574624-ventana-pop-up/
y si sale pero claro sale una ventana flotante literal, yo quiero algo más ligero, sin marco ni nada.
Gracias!
Lo que busco es algo como lo que se ve en la última imagen, que se adapte a móvil, porque estoy comprobando que la ventana flotante que puse no funciona bien en móvil.
Este es el enlace, en el apartado "lucha contra incendios"
http://previnsa.com/webnueva/cursos2.html
comodo
Hola, puedes usar el plugin fancybox. Sirve para mostrar contenido en pop ups. Yo lo he usado bastante para mostrar imágenes y otros contenidos en popup.
Suerte
violeta_mateu
@comodo pero eso es para wordpress ¿no? yo estoy haciéndolo con html, css, js y
php
comodo
Funciona en cualquier tipo de web. Es fácil de usar y en youtube hay muchos tutos sobre eso. Y la documentación trae ejemplos q solo tienes q copiar y pegar en tu web cambiando los datos a mostrar.
violeta_mateu
Lo solucioné con MODAL
violeta_mateu
@comodo estoy intentando implementar el fancybox, que gracias a ti descubrí, porque quiero que de una imagen salga un lightbox con galería y no me sale.
Copié los js, los css y el html con la clase que corresponde, llamo a los j y css, copié el código javascript, pero no lo hace.
No sé si será porque hay alguna otra función que impide que haga ese efecto pero me abre una ventana nueva con la imagen, no hace efecto lightbox.
Los ejemplos que vi están las fotos unas seguidas de otras y yo solo quiero visualizar una y después que se vea como galería, de igual manera supongo que es poner la clase a todas las fotos que quieres que salgan de esa forma y ya lo hice, pero puede ser esa la razón?.
Es en esta página http://previnsa.com/webnueva/senalizacion.html donde pone "sector energía"
comodo
Buenos días, pues estaba mirando tu web y no veo donde dice "sector de energía", no lo encuentro. De todos modos es un poco difícil para mí hacerme una idea de como lo quieres exactamente sin ver como tienes el código.
De todas formas te envío unos enlaces donde vienen unos ejemplos hechos de una galería de imágenes, con sus atributos y clases. Solo tendrías que poner los tuyos igual que ese ejemplo, siempre que tengas el fancybox bien configurado.
http://fancyapps.com/fancybox/3/docs/#images busca un apartado llamado "grouping"
https://codepen.io/fancyapps/pen/WjVXyx?editors=1000 Aqui viene un ejemplo totalmente hecho para copiar y pegar y cambiar las imágenes.
También como te decía en otro comentario, veo que en tu consola de errores de javascript tienes muchos errores de sintaxis y ejecución y eso puede hacer que algún plugin de javascript no funcione correctamente.
No sé si es eso lo que querías, pero ya te digo que es dificil a veces hacerse una idea :-) Suerte
violeta_mateu
te puse enlace antes http://previnsa.com/webnueva/senalizacion.html , está a la izquierda de esa página. Miré un tutorial y no me sirve ya que lo hacen siempre partiendo de cero no implementandolo en una página que ya tiene clases y demás atributos.
Esas páginas son las que estuve consultando pero no me solucionan nada.
violeta_mateu
aquí una parte del código
comodo
Si lo que quieres es que al clicar en la imagen te aparezca una galería de imágenes, deberías enlazar el href con un div que contenga esa galería. Ahora mismo cuando haces click en la imagen se abre en popup la imagen que tu has indicado en el enlace, pero nada mas... porque no hay mas imágenes.
Entonces necesitas hacer un div oculto con una lista de las imágenes y añadirle el atributo de fancybox para que se abra. Luego en el enlace principal debes indicarle que el href hacia ese div oculto, además de añadirle los atributos necesarios de fancybox y ya está, es muy fácil. Hay muchos tutos sobre eso y en cuanto le eches un rato seguro que lo sacas.
Suerte.
violeta_mateu
Gracias por contestarme. Te aseguro que llevo echados muchos ratos. Lo que me dices de que solo hay una foto no es así ya que con el reel:group ya estoy llamando a varias ¿o no?, pero además es que no hace popup lo que hace es abrir la pagina en una nueva ventana.
No sé como se hace un div oculto