过渡后jQuery Mobile视频闪烁

【问题标题】：jQuery Mobile video flicker after transition过渡后jQuery Mobile视频闪烁
【发布时间】：2012-10-08 22:12:16
【问题描述】：

我正在使用 jquery mobile 和 phonegap 为 iPad 制作一个小应用程序。页面转换很好，事情似乎运作良好。但是，当我将视频（HTML5 视频标签）添加到其中一个页面时，除了偶尔在页面从带有视频的页面过渡之后，它会闪烁视频框，但大多数情况下仍然可以正常工作。只发生大约 30% 的时间。似乎有点随机。因此，每当我从我的视频页面过渡时，它都会在下一页上的视频闪烁片刻。它真的很烦人。在模拟器中也不会发生。

有谁知道如何阻止它？我已经尝试了所有方法，包括添加 -webkit-backface-visibility: hidden;到我在 jquery 移动 CSS 中的 .ui-page 类。似乎没有什么能阻止它。

感谢您的帮助。

【问题讨论】：

标签： jquery video mobile flicker

【解决方案1】：

在这里找到了一些信息； https://github.com/jquery/jquery-mobile/issues/455

老错误，线程中的一些小修复，但尚未发布。

似乎是按照您设置“webkit-backface-visibility”的顺序，首先我尝试了单独的 .css 文件并提前加载它。有些闪烁消失了，有些仍然离开。

然后我在标签末尾的所有内容之后添加了以下代码，并且视频/过渡不再在 iphone 和 ipad 上闪烁。

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>

<style>
    /* patch for jquerymobile page flicker */
    .ui-page {
        -webkit-backface-visibility: hidden;
    } 
</style>
</head>

【讨论】：