Gjengaar Posted October 15, 2021 Posted October 15, 2021 Site URL: https://markusgjengaar.com/ Hi! I've made a custom HTML/CSS code that could play a video on my front page. The video works on Safari (both mobil and desktop) and it works on Google Chrome on my iPhone. However the video does not work on Chrome Desktop version for some reason. It used to work, but now it does not play anything. It's just a blank black space where the video should be. Anyone out there knows whats happening? Here is my code: <section class="Intro"> <video class="Intro-video" src="/s/Hero-Home-page_v4.mp4" preload="auto" autoplay="auto" playsinline="auto" muted="auto" loop="auto" > </video> </section> <style> .Intro-video { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; pointer-events: none; background-size: cover; background-position: center; position: absolute; top: 0; left: 0; } .Intro { width: 100%; height: 80vh; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; position: relative; overflow: hidden; z-index: 1; } </style>
Guest Posted October 15, 2021 Posted October 15, 2021 I'm guessing the file is HEVC encoded. Have you tried encoding in H.264 to see if this works?
Gjengaar Posted October 15, 2021 Author Posted October 15, 2021 Yes that seems to be it! Does Chrome not support H.265? The video now definitely lost a lot of quality being exported to H.264, so I would love to know what the best format for Chrome would be. Is there a way I can let Safari play a H.265 file, and Chrome play a H.264 file? My video used to work in Chrome, so is there any new update or something they changed?
Guest Posted October 15, 2021 Posted October 15, 2021 1 minute ago, Gjengaar said: Does Chrome not support H.265? Not currently, no. https://caniuse.com/?search=hevc
Recommended Posts
Archived
This topic is now archived and is closed to further replies.