在网络上提供同时适用于 iPhone/iPad 的视频的最佳方式是什么?

发布于 2024-10-19 20:10:41 字数 159 浏览 2 评论 0原文

是否有一种通用方法可以在 iPhone/iPad 上实现网络视频?

我的想法是提供两个版本(Flash 和 HTML5)并使用 JavaScript 检查是否支持 HTML5 - 如果支持,则播放 Flash;如果支持,则播放 Flash。如果没有,请播放 HTML5。也许有更好的方法?

Is there a common way to implement videos on the web that will also work on iPhone/iPad?

My idea is to provide two versions (Flash and HTML5) and check with JavaScript if HTML5 is supported — if so, then play Flash; if not, play HTML5. Maybe there’s a better way?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

-黛色若梦 2024-10-26 20:10:41

深入研究 HTML5 在这里:http://diveintohtml5.ep.io/video.html

最终的标记使用
HTML5 视频的元素,嵌套
Flash 后备元素,
和一小段脚本
Android 设备的好处:

<video id="movie" width="320" height="240" preload controls>
  <source src="pr6.webm" type='video/webm; codecs="vp8, vorbis"' />
  <source src="pr6.ogv" type='video/ogg; codecs="theora, vorbis"' />
  <source src="pr6.mp4" />
  <object width="320" height="240" type="application/x-shockwave-flash"
    data="flowplayer-3.2.1.swf"> 
    <param name="movie" value="flowplayer-3.2.1.swf" /> 
    <param name="allowfullscreen" value="true" /> 
    <param name="flashvars" value='config={"clip": {"url": "http://wearehugh.com/dih5/pr6.mp4", "autoPlay":false, "autoBuffering":true}}' /> 
    <p>Download video as <a href="pr6.mp4">MP4</a>, <a href="pr6.webm">WebM</a>, or <a href="pr6.ogv">Ogg</a>.</p> 
  </object>
</video>
<script>
  var v = document.getElementById("movie");
  v.onclick = function() {
    if (v.paused) {
      v.play();
    } else {
      v.pause();
    }
  };
</script>

Dive into HTML5 nails it here : http://diveintohtml5.ep.io/video.html

The final markup uses a
element for HTML5 video, a nested
element for Flash fallback,
and a small bit of script for the
benefit of Android devices:

<video id="movie" width="320" height="240" preload controls>
  <source src="pr6.webm" type='video/webm; codecs="vp8, vorbis"' />
  <source src="pr6.ogv" type='video/ogg; codecs="theora, vorbis"' />
  <source src="pr6.mp4" />
  <object width="320" height="240" type="application/x-shockwave-flash"
    data="flowplayer-3.2.1.swf"> 
    <param name="movie" value="flowplayer-3.2.1.swf" /> 
    <param name="allowfullscreen" value="true" /> 
    <param name="flashvars" value='config={"clip": {"url": "http://wearehugh.com/dih5/pr6.mp4", "autoPlay":false, "autoBuffering":true}}' /> 
    <p>Download video as <a href="pr6.mp4">MP4</a>, <a href="pr6.webm">WebM</a>, or <a href="pr6.ogv">Ogg</a>.</p> 
  </object>
</video>
<script>
  var v = document.getElementById("movie");
  v.onclick = function() {
    if (v.paused) {
      v.play();
    } else {
      v.pause();
    }
  };
</script>
染火枫林 2024-10-26 20:10:41

您可以使用 HTML5 video 标签作为默认选项,并在其中放置一个后备 object 标签。

您可以在此处了解有关 Safari(包括 Mobile Safari)中 HTML5 video 标记使用情况的信息:https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Introduction/Introduction.html

You can use HTML5 video tag as a default option and put a fallback object tag inside it.

You can read about HTML5 video tag usage in Safari (including Mobile Safari) here: https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Introduction/Introduction.html

雨后彩虹 2024-10-26 20:10:41

您可以使用此类呈现应用程序资源包中的视频或通过互联网流式传输的视频:MPMoviePlayerController

Apple 文档:

http://developer.apple.com/library/ios/#documentation/mediaplayer/reference/MPMoviePlayerController_Class/MPMoviePlayerController/MPMoviePlayerController.html

You can present videos either from your app's resource bundle or streamed via the internet, using this class: MPMoviePlayerController

Apple docs:

http://developer.apple.com/library/ios/#documentation/mediaplayer/reference/MPMoviePlayerController_Class/MPMoviePlayerController/MPMoviePlayerController.html

寻梦旅人 2024-10-26 20:10:41

我发现这非常有帮助:

http://camendesign.com/code/video_for_everybody

它使用 HTML5,但是优雅地无法闪烁。

I found this to be very helpful:

http://camendesign.com/code/video_for_everybody

It uses HTML5 but gracefully fails to flash.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文