autoplay video in IOS devices
Hi,
Can someone help me with a sample code to Autoplay a HTML video on IOS. I have a video that used to autoplay in IOS but not anymore, also how would I autoplay and start the video from a different position
i.e 40 seconds before the end.
Can someone help me with a sample code to Autoplay a HTML video on IOS. I have a video that used to autoplay in IOS but not anymore, also how would I autoplay and start the video from a different position
i.e 40 seconds before the end.
Julian Hansen
Can you show us your code.
Hi,
try this
be aware that video most of the time won't auto play on mobile device, as user may have some device setting to prevent this or browser settings.
Always put a poster so if any compatibility problem user will at least see something.
try this
<video src="/video.mp4" loop autoplay playsinline poster="/poster.png">
</video>be aware that video most of the time won't auto play on mobile device, as user may have some device setting to prevent this or browser settings.
Always put a poster so if any compatibility problem user will at least see something.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Hi All, thank you for answering, below is the code I am using.
Autoplay is working in android and desktop. but not on IOS. I will test the above solutions and get back to you.
Autoplay is working in android and desktop. but not on IOS. I will test the above solutions and get back to you.
<video id="VideoResult" class="video-js vjs-default-skin" height="360" width="640" preload="" controls="" autoplay="">
<source src="http://mediarnsw.skyracing.com.au/Race_Replay/2019/02/20190218BALR01_V.mp4" type="video/mp4">
<p class="vjs-no-js">To view the video, you need to get the latest <a href="http://www.adobe.com/go/getflash/" target="_blank">Adobe Flash Player</a>. After installing, please close this browser window and click the video replay again.</p>
</video>ASKER
Thank you, David Favor.
After thought: There is a work around for this problem.
The fix can be fairly time intensive to get working + generally never works as good as looping videos + in the future, this may be the only solution.
Convert your video to an animated image, as follows.
1) Build latest ffmpeg version from source.
2) Run ffmpeg to split entire video into set of frames. If you have a 10 second, 30fps video, you'll end up with 300 frames.
3) Running the ffmpeg split, output the frames in the exact image type you're targeting, so if your final image will be a .apng, then you'll use .png images for your split.
4) Apply a common compression algorithm to all your .png files.
5) Now stitch the image files back together using ImageMagick, something like this...
It's been several years since I had to do this, so ffmpeg syntax + ImageMagick syntax has likely changed, so if you go this route, best research best approach... which also means... there may be other tools available to stitch together images into your final output image.
The fix can be fairly time intensive to get working + generally never works as good as looping videos + in the future, this may be the only solution.
Convert your video to an animated image, as follows.
1) Build latest ffmpeg version from source.
2) Run ffmpeg to split entire video into set of frames. If you have a 10 second, 30fps video, you'll end up with 300 frames.
3) Running the ffmpeg split, output the frames in the exact image type you're targeting, so if your final image will be a .apng, then you'll use .png images for your split.
4) Apply a common compression algorithm to all your .png files.
5) Now stitch the image files back together using ImageMagick, something like this...
convert -delay 1-loop 0 sphere*.png animated.apngIt's been several years since I had to do this, so ffmpeg syntax + ImageMagick syntax has likely changed, so if you go this route, best research best approach... which also means... there may be other tools available to stitch together images into your final output image.