相关疑难解决方法(0)

iPad Safari mobile似乎忽略了html5视频元素的z-indexing位置

我在一个页面上有一个视频元素,它在safari移动和桌面上都运行良好.我有一个透明的下拉菜单,工作正常.问题是,当菜单在视频元素上时,在桌面游戏中我可以看到菜单下的视频(根据需要),而在移动版本上,视频元素保持在前景(丑陋),无论我告诉什么css.有没有解决方法?

问题的形象

mobile-safari ipad html5-video

36
推荐指数
5
解决办法
3万
查看次数

移动Safari:视频元素上的链接(<a>)元素在点击时不起作用

我目前的项目是一个html网站,其中包含一个下拉菜单(javascript/jquery)和一个html5视频播放器(仅限视频标签).

单击菜单条目时,下拉子菜单将覆盖videoplayer容器(下拉列表的z-index高于videoplayer).在Safari和Chrome中,子菜单条目的链接在点击时可以正常工作,但在iPad上的Mobile Safari中他们没有反应.为了减少这个问题,我的最小示例包括一个覆盖视频元素的链接元素.

<head> 
<style>
a {
    position: absolute;
    display: block;
    z-index: 1;
}
video {
    position: absolute;
    z-index: 0;
}
</style>    
</head> 

<body > 
<a href="http://www.google.de">click me</a>
<video src="" width="640" height="360" preload="none" controls="controls"></video>
</body> 
Run Code Online (Sandbox Code Playgroud)

触摸iPad上的链接元素不起作用.任何建议都赞赏如何在iPad上点击链接!

mobile-safari html5-video

17
推荐指数
2
解决办法
9092
查看次数

iPad上的HTML5视频分层

我有Ooyala提供的视频,可以在所有设备上播放.当用户在iPad上并尝试通过下拉子窗口查看页面时,会出现此问题.该subnav的每个部分无非是ul>lidiv隐藏,并通过CSS所示.当视频正在播放或暂停时(不是在加载时)并且用户点击主导航(以显示相应的子窗口),子窗口覆盖视频.但是,这些链接都没有响应水龙头.当尝试点击子空间链接时,视频会响应,就好像它被点击一样(显示擦除器).

我已经尝试 各种各样解决方案,包括弄乱z-index所有相关元素,都无济于事.有什么我想念的吗?

如果您想亲自尝试一下,请在iPad上访问http://www.cordblood.com,点击(或等待)第二张(或第三张或第四张)幻灯片,点击"观看视频",点击播放(如果你愿意,也可以暂停视频),点击主导航,然后尝试点击子视频显示的其中一个选项.

css ipad html5-video ooyala

5
推荐指数
2
解决办法
3465
查看次数

覆盖在ipad中动态插入的视频标签

我目前正在开发支持ipad的视频播放器.
它更像是一个jquery插件.它在桌面上运行良好,我甚至设法在ipad上添加我的自定义控件.
到现在为止还挺好.
问题是我正在创建和动态插入视频元素,这有点混淆了ipad.我遵循这种方法,因为我发现(经过几个小时),如果你试图$.wrap将视频包装()到一个容器中,视频就会崩溃.
插入视频后,它几乎正常运行(可播放并响应事件),但它的位置/显示属性混乱:我无法在其上添加任何叠加.这是一个问题,因为我希望我的控件能够显示在视频之上.

此外,视频本身不响应正常touchmove touchstart touchend事件.经过一些研究后发现,如果您没有打开默认控件,视频会捕获所有事件(<touch>标签上的iPad触摸事件).
我的第二个问题是,在包含默认控件之后,视频元素似乎仍然忽略了我的事件处理程序.

所以,我的问题是(两者都只在Ipad案例中):

  • 你有没有遇到过这个问题,当然如果你这样做了,你是怎么解决的?
  • 只做硬编码的视频元素会触发事件吗?

javascript video ipad html5-video

2
推荐指数
1
解决办法
8522
查看次数

标签 统计

html5-video ×4

ipad ×3

mobile-safari ×2

css ×1

javascript ×1

ooyala ×1

video ×1