Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

204
Vistas
How to autoplay any iframe video if it is in the viewport

there developers I'm actually in a bit of a problem I'm trying to make stuff something like if the iframe is in the viewport then video will autoplay

Condition

  1. Iframe is in viewport then video will play
  2. iframe video get paused if it is not in the viewport
  3. iframe video get paused if any modal open

    function playvideo(iframe) {
      iframe.contentWindow.postMessage(
        '{"event":"command","func":"playVideo","args":""}',
        '*'
      )
    }
    
    function pausevideo(iframe) {
      iframe.contentWindow.postMessage(
        '{"event":"command","func":"pauseVideo","args":""}',
        '*'
      )
    }
    let observeroptions = {
      root: null,
      rootMargin: '0px',
      threshold: 1.0
    };
    
    let callback = (entries, observer) => {
      entries.forEach((entry) => {
        if (entry.isIntersecting) {
          playvideo(entry.target)
        } else {
          // pausevideo(entry.target);
          observer.unobserve(entry.target)
        }
      })
    }
    let observer = new IntersectionObserver(callback, observeroptions);
    
    $(window).scroll(function () {
      $('iframe').each(function (e) {
        if ($(this).isInViewport()) {
          observer.observe($(this)[0])
        }
      })
    })
This is my website link

https://letscodeon.me/research.php?category=videos

Problem The problem is that video is getting paused when the page reload it is not autoplaying when it is in viewport If i play one video then autoplay is working if i'm opening a modal then back video is not getting paused

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda