移动嵌入式Youtube iframe无法播放

时间:2013-09-21 00:39:14

标签: css mobile iframe

我的网站上有一个youtube iframe视频无法播放,但仅限于移动设备(我在iPhone5上使用iOS7)。它在我测试过的桌面浏览器中运行良好,所以我不确定它为什么不能在我的移动设备上播放。我从未在iOS6上测试它。

我正在使用媒体查询来控制iframe的宽度和高度,但是无法理解为什么会产生问题(此外,媒体查询可以正常使用桌面上的视频)..你有什么想法吗?为什么不玩?您可以在http://nickbewley.com/music/lee-fields/查看问题示例。谢谢你的任何想法!

1 个答案:

答案 0 :(得分:1)

以下div与它重叠..您无法点击/触摸它来播放。

<div class="music-description">My Favorite Album by Lee Fields: </div>

忘记正好掩盖问题的z-index。而是解决问题:

.music-description {
    display: block; /* REMOVE */
}

.music-title {
    display: inline; /* REMOVE */
    display: block; /* ADD */
}

或者只需将span代码更改为divs(参考.music-title

这样做可以为您提供所需的风格。

enter image description here