Member Avatar for koneill

All,

I have a .mov file and am wondering what is the best way to have this autoplay so that users don't have to hit the play button while viewing on a IPhone device.

I tried utilizing the ac_quicktime.js script as such (I went to the ac_quicktime.js - a few months back because it helped with some items - that users were exhibiting in regard to when the video was loading)

<script language="JavaScript" src="ac_quicktime.js" type="text/JavaScript"></script>
<script language="JavaScript" type="text/javascript">
QT_WriteOBJECT_XHTML('MVI_5159.mov', '190', '245', '', 'autoplay', 'true', 'controller', 'true', 'loop', 'true');
</script>

Then I went old school and tried the following which doesn't work on an IPhone:
<embed src="MVI_5159.mov" width="190" height="245" autoplay="true" controller="false" loop="true" pluginspage="http://www.apple.com/quicktime/">

Ideally the simplest way to do this in script or html would be great.

  • 3 Contributors
  • 3 Replies
  • 657 Views
  • 12 Hours Discussion Span
  • Latest Post Latest Post by rproffitt

Dani AI

Generated

Brief update tied to the thread: asked about making a .mov autoplay on iPhone, and and pointed toward HTML5 and format conversion. The practical, modern approach is to serve a web-optimized video (H.264/AAC in an MP4 container or an equivalent supported codec) and let the browser autoplay only when the element is silent and allowed to play inline — that behavior was formalized by WebKit starting with iOS 10. (webkit.org)

A minimal, widely compatible pattern is an HTML5 <video> element that is muted and marked for inline playback. Example structure (use a small poster image as fallback and provide an explicit MP4 source):

<video autoplay muted loop playsinline webkit-playsinline preload="metadata" poster="thumb.jpg">
  <source src="hero-video.mp4" type="video/mp4">
  <!-- fallback image or GIF here -->
</video>

The key points: muted or no audio is what lets modern browsers permit autoplay; playsinline prevents iPhone from forcing fullscreen; the play() call returns a Promise that will be rejected if autoplay is blocked. (mdn.club.tw)

Production notes for converting a .mov: re-encode to an H.264 MP4 with a web-friendly profile, ensure pixel format compatibility (yuv420p) for older players, and move the MP4 index (moov atom) to the start so the file can stream progressively. Example ffmpeg patterns used in production:

ffmpeg -i input.mov -c:v libx264 -profile:v baseline -pix_fmt yuv420p -crf 23 -c:a aac -b:a 128k -movflags +faststart output.mp4

# or to make a silent file for autoplay:
ffmpeg -i input.mov -c:v libx264 -movflags +faststart -an output-silent.mp4

Moving the moov atom (faststart) speeds progressive playback. (ffmpeg.org)

Common gotchas and fallbacks: the host must serve the correct MIME type and support HTTP byte-range requests (progressive download / seeking). Autoplay can also be suppressed by system-level battery/data saver modes (iOS Low Power Mode will block autoplay and show a play button), so provide a poster or a GIF fallback and graceful controls if autoplay fails. Test on real devices and check the video element’s promise rejection for diagnostics. (w3c.github.io)

Recommended Answers

All 3 Replies

Member Avatar for gentlemedia

Apple blocks autoplay of media (video or audio) in Safari on iOS by default and if you're going to use the video tag, then I'd recommend to convert your .mov file to .mp4 instead, so that the video also plays in other browsers/devices.

Edited by gentlemedia
Member Avatar for rproffitt

Gentlemedia is right.

At the link supplied "Warning: To prevent unsolicited downloads over cellular networks at the user’s expense, embedded media cannot be played automatically in Safari on iOS—the user always initiates playback." So there it is.

Added with edit. Had a second thought and tested it. GIF plays without user intervention. It's not perfect but I did check this out on my iPhone 5s on iOS 10.0.2. Works. If you need a convertor, try Zamzar.

Edited by rproffitt
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.