Collectives™ on Stack Overflow
Find centralized, trusted content and collaborate around the technologies you use most.
Learn more about Collectives
Teams
Q&A for work
Connect and share knowledge within a single location that is structured and easy to search.
Learn more about Teams
I've done an hour of googling but I either suck at it, or it isn't a common issue.
Here's my video tag:
<video class="video-background" preload="none" loop="loop" autoplay="autoplay">
<source src="/resource/video/ripples.webm" type="video/mp4">
<source src="/resource/video/ripples.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
No matter what order I place them in, neither the webm
nor the mp4
will load, they just show a blank white screen. I'm also not getting a 404 from the server so the videos should be coming down from the server?
Appreciate any input
EDIT: We removed the preload="none"
attribute and now the first frame of the video shows up, but it doesn't auto-play the rest of the video for some reason (despite having autoplay="autoplay"
on the element.
–
–
I ran into a very similar issue where the solution ended up being the fact that I was providing a string with "px" when it expected a number for width and height. Took me FOREVER to catch the mistake and just showed a blank screen.
// BLANK WHITE SCREEN + HAIR PULLING
<video width="200px" height="300px" controls>
<source...
// WORKING VIDEO PLAYER
<video width="200" height="300" controls>
<source...
Hope this helps others.
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.