Question

我正在尝试对此代码进行故障排除，并且遇到了死胡同，所以我想我会在这里问我的第一个问题。我有三个问题：

1）为iPhone特定视图嵌入mp4的最佳方法是什么，最好不使用Javascript？

2）是否有在iPhone上调试代码的首选做法？

3）有人能告诉我下面的具体代码有什么问题吗？我应该事先提到变量$ fileName确实包含正确的信息，我刚刚省略了那部分代码。此外，在我收到灰色的，破损的QuickTime图像之前，海报图像会短暂闪烁，这表明这部分正常工作。

代码：

<object width="448" height="335" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
    <param name="src" value="/libraries/images/$fileName.jpg" />
    <param name="href" value="/libraries/media/$fileName.mp4" />
    <param name="target" value="myself" />
    <param name="controller" value="true" />
    <param name="autoplay" value="false" />
    <param name="scale" value="aspect" />
    <embed src="/libraries/images/$fileName.jpg" href="/libraries/media/$fileName.mp4" type="video/mp4" target="myself" width="448" height="335" scale="aspect" controller="false" autoplay="false"> </embed>
</object>

Answer 1

你没有嵌入它，你链接到它。通常，链接是视频本身的缩略图。 iPhone不支持直接在网站中嵌入电影文件。

点击该链接将在用户的iPhone上打开Quicktime，然后在完成后将其返回到网页。

即使嵌入作品，链接的图像也会更容易记住：

<a href="/libraries/media/$filename.mp4"><img src="/libraries/images/$filename.jpg" width="448" height="335" /></a>

Answer 2

从OS 3.0开始，您可以使用<VIDEO>标记

Answer 3

尽管存在一种常见的误解，但您可以使用第二个对象标记而不是embed标记，同时将参数更改为元素并使用type =“video / quicktime”。实际上所有浏览器的结果都是一样的（我还没有看到问题，虽然我被告知IE6搞砸了），页面将验证。 iPhone上的结果与桌面浏览器略有不同。除非您明确设置了海报框架，否则它将使用黑色框架。它还会在海报框架顶部放置自己的播放按钮。（如果有人知道如何禁用其中任何一个，我很想知道如何）通过这样做，你可以完成整个事情，而不需要任何Javascript。如果你想看一个例子，这里有一个：http://www.cdjunior.com/CD_JR/view.php?name=jehovahs_witnesses。源的相关部分是线94-100。我不知道你是否可以使用embed标签并使其工作。现在我想起来了，我想这可能就是Apple Javascript的用法。

Answer 4

这是AlBeebe提到的实现（HTML 5 video标记）。

这将需要一个mp4并将其嵌入iPhone frame而不使用JS。但是，您可能会遇到调整问题的大小，因此请为min-width: 758px;设置body。

如果事物未对齐，请使用video坐标进行调整。

<强> HTML

<div id='photo'>
   <div id='phone'>
      <img src='img/phone-border.png'/>
      <video src='img/cloud.mp4' autoplay loop width="209" height="370" poster="img/first-frame.png"/>
   </div>
</div>

<强> CSS

#phone {
   position: relative;
}
#phone img {
   width: 300px;
   height: auto;
}
#phone video {
   position: absolute;
   width: 209px;
   height: 370px;
   top: 50%;
   left: 50%;
   margin-left: -182px;
   margin-top: -185px;
}

在不使用JavaScript的情况下为iPhone嵌入mp4的最佳方法是什么？

代码：

4 个答案: