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
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])
}
})
})
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