如何在 jquery mobile 中显示所有移动设备和 Web 浏览器的启动画面答案

【问题标题】：How to display the splash screen for all mobile devices and web browser in jquery mobile如何在 jquery mobile 中显示所有移动设备和 Web 浏览器的启动画面
【发布时间】：2012-06-19 05:12:46
【问题描述】：

我正在开发一个 jquery 移动应用程序，我想在其中显示所有设备的启动画面，包括 ipod、iphone、android 手机、网络浏览器。

我试过下面的代码：

1.)

<script type="text/javascript">
 (function () {
  var a; if (navigator.platform === "iPad") {
     a = window.orientation === 90 || window.orientation === -90 ?
"_Startup_748x1024.png" : "Startup_768x1004.png"

 } else {
     a = window.devicePixelRatio === 2 ?
   "Startup_640x920.png" : "Startup_320x460.png"

 }
 document.write('<link rel="apple-touch-startup-image" href="' + a + '"/>') })()

以上代码不适用于安卓手机和网络浏览器。

2.)

<div data-role="page" id="splash"> 
 @Html.Partial("_MobileHeader")
  <div class="splash">
        <img src="images/_Startup_748x1024.png" alt="startup image" style="width: 100%; height: 100%" />
    </div>
       <div data-role="content" id="pagecontent" data-theme="c">
    @RenderBody()
        </div>
    <!--End content div  -->
    @Html.Partial("_MobileFooter")
</div>

and the script that i have used is :

$(document).on('pageinit','#splash',function(){
setTimeout(function(){
    $.mobile.changePage("#pagecontent", "fade");
}, 4000);  });

通过上面的代码，两个 div 一起显示，我只想先显示初始屏幕，然后再显示另一个 div 的内容。

请就上述问题向我提出可能的解决方案，我们将不胜感激。

提前致谢。

【问题讨论】：

您希望所有设备（包括台式机）都发生这种情况？
嗨，查理，是的，我希望它适用于所有设备，包括台式机。
这些闪屏图片可以灵活吗？我的意思是可以将其中的文本和图像制作成 HTML 和 CSS 而不是图像吗？

标签： asp.net-mvc jquery-mobile startup splash-screen

【解决方案1】：

我已将这个问题修复如下：

1.) 创建了一个作为默认操作的操作，在第一次打开移动应用程序时调用，并在其视图页面中设置要根据方向显示的图像设备，由jquery完成。

2.) 然后重定向到另一个动作或在此启动画面后的主页上在头部添加以下行部分：

<meta http-equiv="refresh" content="4;URL='the link which you want to call after that'" />

从这里开始，图像将显示 4 秒，如“内容”中所述，然后重定向到指定的 URL。

它适用于所有设备。 :)

【讨论】：