<video autoplay muted loop id="videobg">
<source src="bgvideo/bgvideo.mp4" type="video/mp4">
</video>
Hey guys i am using a background video for a website it perfectly works on pc but on iphone it's not working
Link to website: https://fierce-atoll-94899.herokuapp.com/
You most likely need to add the playsinline attribute as well, otherwise e.g. on iPhone the Video would only be played in full screen.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video
Related
I'm trying to add video to a portfolio site I'm working on, but it has this choppy quality to it, like it's lacking anti-aliasing.
Or it could be something else.. Does anybody have any clues?
It looks fine when I play it in a video player.
(Open the image in full view to see artifacts better)
Here's the code for the video tag:
<video width="100%" class="videoStyle" autoplay muted loop>
<source src="video/01-02.mov" type="video/mp4">
Your browser does not support the video tag.
</video>
this screenshot on mobile, the video doesn't autoplay even when i click on the play arrow button(which shouldn't even be there) still doesn't play at all, its like a picture but on desktop it's perfectly fine.
I tried this code
<video preload autoplay loop muted defaultMuted playsinline>
<source src="video2.mp4" type="video/mp4">
</video>
but still no
I am trying to make the video in my website full screen but viewing it on iphone it redirect me to the video, is there a way play the video on same page?
<video poster="poster.jpg" preload autoplay loop>
<source src="vimeo.mp4" type="video/mp4">
To get the best experience of this website please consider updating your web browser
</video>
~
<video <video poster="poster.jpg" preload autoplay loop playsinline>
<source src="vimeo.mp4" type="video/mp4">
To get the best experience of this website please consider updating your web browser
</video>
you can simply add the "playsinline" attribute in the video tag, you may also include "webkit-playsinline"
I am trying to make a video my background, which will loop. It works perfectly on PC, but once I test it on mobile (IOS) it doesn't appear.
I've tried putting playsinline and making the the video path absolute, but it it still doesn't work on mobile.
HTML
<video autoplay muted loop playsinline id="myVideo">
<source src="vhs.mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>
Note: What could be an alternative to having a video be the background?
I initially wanted the same video, but in .gif format. However, it was not nice.
I am using jquery mobile and video tag to display videos.
My video plays fine on all 'desktop' browsers, but when play when I use the following code in mobile safari (iPhone) it shows only black rectangle without any controls.
I used video used commonly in html5 examples. (from http://www.bigbuckbunny.org) so it shouldn't be encoding issue.
When I access video directly by typing its url http://myurlofvideo.mp4 it plays correctly in mobile Safari.
What's causing the problem?
Thank you in advance!
<video width="75%" id="video1" controls="true" autoplay="true">
<source src="videos/mov_bbb.mp4" type="video/mp4">
<source src="videos/mov_bbb.webm" type="video/webm">
Your browser does not support the video tag.
</video>
I tried the sample below in iphone simulator and it is working ,check it out .
<video width="320" height="240" controls>
<source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
it shows preview image of the video,when you click on it plays in fullscreen.