视频作为 phonegap 上的闪屏答案

【问题标题】：Video as splash screen on phonegap视频作为 phonegap 上的闪屏
【发布时间】：2016-03-28 13:17:03
【问题描述】：

视频 mp4 或任何格式的闪屏混合应用（如 phone gap/cordova）。喜欢当前的优步应用

【问题讨论】：

标签： cordova mobile phonegap-plugins phonegap-build phonegap-cli

【解决方案1】：

我知道我来晚了，但是您可以在加载文档后使用 HTML5 标签播放视频。监听事件（视频结束）隐藏视频并显示启动后的内容

这是一个示例

<div id="splashVid" class="centerpage" style="overflow:hidden; display:block">
    <video width="100%" autoplay onended="splashEnd();">
        <source src="BT-logo-splash.mov" type="video/mp4">
        Your browser does not support the video tag.
    </video>
</div>

在“splashEnd()”函数中，您可以编写启动视频结束时想要执行的操作

另外，在我的情况下，视频在应用程序包中本地可用。如果您使用的是 URL，请确保监听该标签的其他事件，以确保用户不必在应用启动时面临缓冲。

【讨论】：

【解决方案2】：

在 phonegap/Cordova 中不能将 mp4 或 gif 文件作为启动画面。您可以直接加载index.html页面，在那里您可以播放视频，您可以导航到下一页。

希望对你有帮助。

【讨论】：

hi naresh thanq 回复..我尝试但视频高度和宽度不正确。请分享任何示例.....thanq

【解决方案3】：

这是您的 splashscreen.html 和 splashscreen.js，将它们包含在您的应用中，并通过设置 setTimeout 时间

$(document).ready(function(){
         var url = $('iframe').attr('src');
         url = url+'?autoplay=1';
  $('iframe').attr('src', url);

        setTimeout(function(){
                //location.href="home.html";//redirect to home from here,you can set timeout to the video length
alert("video Completed");
            },5000);
        });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body style="margin:0px;padding:0px;overflow:hidden">
    <iframe src="http://www.youtube.com/embed/XGSy3_Czz8k" frameborder="0" style="overflow:hidden;height:150%;width:150%" height="150%" width="150%"></iframe>
</body>

【讨论】：

【解决方案4】：

cordova 闪屏是一个本机对话框，当混合应用程序在 web 视图中加载时显示。至少这应该是正确的用法。

任何关于显示 HTML 视频/动画等的解决方案都是关于在 web 视图中显示它们。所以一点用处都没有。

最好的解决方案是 fork cordova 闪屏插件并添加视频支持。

【讨论】：