ios中的嵌入式视频阻止了导航栏功能jquery mobile

时间:2013-09-26 12:18:07

标签: jquery ios jquery-mobile cordova

希望快速解决。

我在我的data-role="content"中嵌入了一个视频,该视频滚动到我固定的导航栏页脚下方。

这很好用,视频海报/框架也在我的页脚下滚动。

然而,当视频帧直接位于固定的导航栏页脚下方(即堆叠的页面中间滚动条)时,导航栏上的任何点击都会响应,就像它们的视频帧实际位于顶部一样。

因此,尽管从视觉的角度来看,一切都应该出现,然后点击相反的方式。

编辑:当使用cordova 2.9.0和xcode 4.6打包并在xcode中的模拟器中运行时会发生这种情况。它不会发生在Web浏览器中。

我试图用z-index解决这个问题,但它似乎没有用。这是相关的代码:

<div data-role="content">




    <video poster="img/logo.png">

        <source src="videos/videosample.mp4" type="video/mp4" />

    </video>

</div>

<div class="container"><img src="img/Background_Dark.png" width="100%"/>

</div>

<div data-role="footer" data-tap-toggle="false" data-position="fixed" data-id="myfooter">
    <nav data-role="navbar">
    <ul>
        <li><a href="#page" data-transition="fade"><img src="img/Home_JQuery_Footer_Icon.png" width="35%" alt=""/></a></li>
        <li><a href="#page4" data-transition="fade"><img src="img/About_Us_JQuery_Footer_Icon.png" width="35%" alt=""/></a></li>
        <li><a href="#page3" data-transition="fade"><img src="img/Request_JQuery_Footer_Icon.png" width="34%" alt=""/></a></li>

        </ul>
        </nav>
</div>

感谢。

1 个答案:

答案 0 :(得分:0)

对于寻找类似问题修复程序的人,我发现了this文章,该文章演示了如何从内容区域创建可滚动的div。这解决了我遇到的重叠问题。