我已经尝试过solutions sorts sorts,包括搞乱所有相关元素的z-index,都无济于事.有什么我想念的吗?
如果您想亲自尝试一下,请在iPad上转到http://www.cordblood.com,点击(或等待)第二张(或第三张或第四张)幻灯片,点击“观看视频”,点击播放(如果有话,可以暂停视频你也想要,点击一个主导航,然后尝试点击subnav显示的其中一个选项.
解决方法 我正在使用Flowplayer和一个简单的CSS下拉菜单,并遇到了同样的问题.我有一个下拉菜单,当点击时,覆盖部分视频区域.子菜单按预期显示在视频上,但未发送任何触摸事件.
我通过结合其他人回答this question的一些建议来修复它:我设置可见性:打开菜单时隐藏和可见性:关闭子菜单时可见,并在视频上设置-webkit-transform-style:preserve-3d CSS属性.
这是相关的代码.我遗漏了菜单栏的CSS,但它可以达到你所期望的效果 – 产生一个覆盖部分视频的菜单.
菜单和视频HTML
<div ID='nav'> <ul> ... <!-- bunch of ul/li stuff here for the menu and submenus --> </ul></div><div ID='vIDeoplayer'><!-- for Flowplayer --></div>
CSS
vIDeo { -webkit-transform-style: preserve-3d;}
使用JavaScript
$(document).ready(function(){ $("#nav li").hover( function() { $(this).find('ul:first').CSS({visibility: "visible",display: "none"}).fadeIn(300); $("vIDeo").CSS({visibility:"hIDden"}); },function(){ $(this).find('ul:first').CSS({visibility: "hIDden"}); $("vIDeo").CSS({visibility:"visible"}); } ););总结
以上是内存溢出为你收集整理的css – iPad上的HTML5视频分层全部内容,希望文章能够帮你解决css – iPad上的HTML5视频分层所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)