问题描述
我在我网站的 this page 上遇到视频显示问题,仅在 iOS 移动设备上观看时。
奇怪的是,我在同一页面上有另一个视频元素,并且播放正常。相同的格式,相同的css,html,属性等。两个视频都是用相同的设置在AE中渲染的,所以编解码器也是一样的。
这是包含两个视频的代码部分:
<div id="sec-04" class="project-section">
<div class="projectvid" id="wipeAnim">
<video preload playsinline autoplay loop muted><source src="/assets/truChef_wipeAnimation_16x9.mp4" type="video/mp4"></video>
</div>
</div>
<div id="sec-05" class="project-section">
<div id="imgCont-05" class="projectimg"><div id="img-05" class="img"></div></div>
</div>
<div id="sec-06" class="project-section">
<div class="projectvid" id="explodedAnim">
<video preload playsinline autoplay loop muted><source src="/assets/truChef_explodedView_16x9.mp4" type="video/mp4"></video>
</div>
</div>
注意:
- 这两个视频在 Chrome 开发工具设备模拟中都可以正常播放。
- 这两个视频根本无法在 browserstack.com 的真正云端 iPhone 中播放。
- 在我的实际 iPhone 6 上,第一个视频 (id="wipeAnim") 没有播放, 第二个视频 (id="explodedAnim") 正在播放。
有人知道为什么第一个视频在 iOS 上根本没有播放/显示吗?我想不通 - 这对我来说没有意义。
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)