• Saltar al contenido principal
  • Saltar al pie de página
Zona DPW

Zona DPW

Formación y recursos para desarrolladores web

  • Inicio
  • Contenidos
  • Guías
  • Registrarse
  • Iniciar sesión

Caso práctico: añadir botón para ampliar video en modal

A veces nos encontramos requerimientos o necesidades muy específicos para los que es complicado encontrar algun plugin que nos encaje y que con algo de JavaScript podemos solucionar.

abril 21, 2020 por - Dejar un comentario

¡Enhorabuena!

¿Quieres continuar con el siguiente curso de la lista?

AdelanteCerrar y permanecer aquí

Hoy vamos a ver la solución a un caso práctico que seguramente os sonará, ya que recientemente lo hemos implementado en la Zona DPW.

Se trata del botón que aparece debajo de los videos para poder ampliarlos en una ventana modal.

Requerimientos / problemática

Los videos insertados en los diferentes módulos de la web, mediante un embed de Vimeo, aunque tiene la opción nativa de verlos en pantalla completa, ésta coge automáticamente el total de la pantalla, y en según que monitores puede ser excesivo, por lo que buscaba una forma de poder ampliar el video, pero a un tamaño que le fuera cómodo a cada uno según sus necesidades.

Lo que quería en este caso era que el usuario pudiera visualizar el video en una pantalla modal, que se ajustara al tamaño del navegador, pero hacerlo de forma que:

  • Fuera algo que se aplicara de forma automática y no implicara realizar modificaciones en todas las páginas de la web donde hubiera video.
  • Evitar en la medida de lo posible hacerlo mediante un plugin.
  • Que funcionara en páginas que hubiera más de un video.

Solución aplicada

Este contenido está restringido para los suscriptores de la Zona DPW Premium.

Inicia sesión o registrate para ver este contenido

Este contenido está restringido para los suscriptores de la Zona DPW Premium.

Inicia sesión o registrate para ver este contenido

×

#Casos prácticos

Footer

  • Blog
  • Newsletter
  • Podcast Freelandev
  • Tranquilidad WP
  • OsomPress
  • Contactar
© 2023· esther solà    ·    Aviso legal     ·    Política de privacidad

Acceder a la Zona DPW

¿Has perdido tu contraseña?

Utilizamos cookies para ofrecerte la mejor experiencia en nuestra web.

Puedes aprender más sobre qué cookies utilizamos o desactivarlas en los ajustes.

Zona DPW
Powered by  GDPR Cookie Compliance
Resumen de privacidad

Esta web utiliza cookies para que podamos ofrecerte la mejor experiencia de usuario posible. La información de las cookies se almacena en tu navegador y realiza funciones tales como reconocerte cuando vuelves a nuestra web o ayudar a nuestro equipo a comprender qué secciones de la web encuentras más interesantes y útiles.

Cookies estrictamente necesarias

Las cookies estrictamente necesarias tiene que activarse siempre para que podamos guardar tus preferencias de ajustes de cookies.

Si desactivas esta cookie no podremos guardar tus preferencias. Esto significa que cada vez que visites esta web tendrás que activar o desactivar las cookies de nuevo.