nk-o / jarallax

Parallax scrolling for modern browsers
https://jarallax.nkdev.info
MIT License
1.38k stars 210 forks source link

Local Video doesn't play in Safari #200

Closed LastRose closed 2 years ago

LastRose commented 2 years ago

Issue description:

Local videos don't play in the latest versions of safari (and developer preview). Tried it on an m1 powered iPad Pro and an M1 powered macbook pro. It works on older versions of safari (tested with an ipod touch).

The video is playing, however the space is blank.

If I add autoplay and muted to the video elements (after line 948 in https://github.com/nk-o/jarallax/blob/master/dist/jarallax-video.js) and then force it to redraw

const forceRedraw = function(element){

    if (!element) { return; }

    const n = document.createTextNode(' ');
    const disp = element.style.display; 

    element.appendChild(n);
    element.style.display = 'none';

    setTimeout(function(){
        element.style.display = disp;
        n.parentNode.removeChild(n);
    },20);
}

forceRedraw(document.querySelector('video');

The video starts working.

Possibly a lazy loading/render optimization issue of some kind?

Version used:

Latest version.

Code to reproduce the issue (HTML blocks + JavaScript initialization)

Issue can be seen on the demo website. The youtube one works, but the local video doesn't.

nk-o commented 2 years ago

Hey @LastRose

Thank you for the code example. This looks like a hack, but I tried to find a better solution and had no luck. I hope it will be fixed in future Safari updates.

nk-o commented 2 years ago

I have tested it on iOs 15.1 Beta 3, and seems like working correctly. We just have to wait for the official 15.1 release.