对一个新的app,一般情况都会添加一个介绍和欢迎的页面来告诉用户app的功能和新的特性。

那么在phonegap项目里面如何添加这样个引导欢迎页。

这里需要注意的是只有app第一次打开的时候才会有,其他时候打开时不会出现。

所以这里我用到了html5的localStorage。

接下来看我如何实现的。

1.需要准备一个打开app时显示的页面,我这边用一个logo.html来展示app的介绍图用的是图片滑动。

这里面用来iScroll插件。

同时在启动这个logo.html页面的时候设置一个storage数据。

window.localStorage.setItem(“HomeLogo”, “HomeLogo_hide”);

来判断是否为第一次启动。

具体的代码我这里不贴了,可以看我的附件。

2.其次在我们的index.html页面里面设置一个判断是否为第一次启动。

这里我们需要明确的是app启动的时候一定打开的index文件,而非logo文件。

所以这里我做了一个方法,在index文件一加载的时候来检查HomeLogo 是否存在。

如果存在就不做处理,如果不存在就直接跳转到logo文件,当执行晚上logo文件后,HomeLogo 文件就有了子这样下次打开应用就直接访问index文件。

function loaded() {
try {
var HomeLogo = window.localStorage.getItem(“HomeLogo”);
if (HomeLogo == null) {
window.location.href = “logo.html?p=1″;
}
} catch (e) {
showAlert(“设备不支持!”); // debug
}
}

具体的业务逻辑自己可以处理。

phonegap–app启动欢迎引导页localstorage的更多相关文章

  1. Ionic3 编程-应用启动进入引导页

    新建引导页面 ionic g page welcome 导入组件 修改模版文件:welcome.html 修改样式文件:welcome.scss 安装相关插件: 数据库使用SQLite:ionic c ...

  2. ionic之应用首次启动引导页

    用户首次启动app先进入引导页,localstroge记录状态,下次启动应用不再显示引导页. HTML: <html> <head> <meta charset=&quo ...

  3. IOS 一句代码搞定启动引导页

    前言引导页,一个酷炫的页面,自从微博用了之后一下就火起来了,对于现在来说一个app如果没有引导页似乎总显那么不接地气,那么为了让我们的app也“高大上”一次,我写了一个demo来实现启动引导页的实现, ...

  4. 马蜂窝 iOS App 启动治理:回归用户体验

    增长.活跃.留存是移动 App 的常见核心指标,直接反映一款 App 甚至一个互联网公司运行的健康程度和发展动能.启动流程的体验决定了用户的第一印象,在一定程度上影响了用户活跃度和留存率.因此,确保启 ...

  5. Android项目实战(三):实现第一次进入软件的引导页

    最近做的APP接近尾声了,就是些优化工作了, 我们都知道现在的APP都会有引导页,就是安装之后第一次打开才显示的引导页面(介绍这个软件的几张可以切换的图) 自己做了一下,结合之前学过的 慕课网_Vie ...

  6. 使用ViewPagerAdapter 页面引导适配器设置app启动页,引导页面的实现

    一般的app第一次安装启动的时候,都会有一个启动页面和引导页的画面,然后才进入主程序.anndroid中的ViewPagerAdapter 是一个继承与PageAdapter的 页面引导适配器.由于我 ...

  7. 安卓第一次启动引导页使用ViewPager实现

    我们在安装某个APP的时候,基本都会有一个引导页的提示,他们可以打广告,或者介绍新功能的加入和使用说明等.一般都支持滑动并且下面有几个点,显示共有多少页和当前图片的位置,在IOS上这个实现起来比较简单 ...

  8. APP启动页

    关于APP启动引导页面模块 时间:2016年6月14日 作者:赵锐 模块使用说明 模块暴露在外的接口是- (void)showGuideViewWithImages:(NSArray *)images ...

  9. [iOS] App引导页的简单实现 (Swift 2)

    转载请注明出处:http://www.jianshu.com/p/024dd2d6e6e6# 已更新至 Xcode7.2.Swift2.1 在第一次打开App或者App更新后通常用引导页来展示产品特性 ...

随机推荐

  1. Smart210学习记录-------linux驱动中断

    Linux中断 Linux 的中断处理分为两个半部,顶半部处理紧急的硬件操作,底半部处理不紧急的耗时操作.tasklet 和工作队列都是调度中断底半部的良好机制,tasklet 基于软中断实现.内核定 ...

  2. javascript js表示中文日期的经典写法

    <div id="time"> <script>document.getElementById('time').innerHTML=new Date().t ...

  3. NIO中Selector分析

        NIO中,使用Selector.select()方法来侦听是否有数据可以读/写,服务端开始执行时,如果没有客户端,这里的语句将进行阻塞,等待下面三个情况出现,才会进行后续的方法之行,这里是重点 ...

  4. java生成随机大数据文件

    package iie.udps.test; import java.io.BufferedWriter; import java.io.File; import java.io.FileOutput ...

  5. .net中创建xml文件

    //创建空的XML文档 XmlDocument xmldoc = new XmlDocument(); xmldoc.LoadXml("<?xml version='1.0' enco ...

  6. ZOJ 1241 Geometry Made Simple

    /*Mathematics can be so easy when you have a computer. Consider the following example. You probably ...

  7. js如何把字符串转换成json数据的方法

    js如何把字符串转换成json数据的方法 function strtojson(str){ var json = eval('(' + str + ')'); return json; } 方法二 f ...

  8. spark-scheduled调度算法

    1.3源码是如此,后面新版本源码会尽可能的根据用户shell配置的参数进行分配 1.spareadOutApps 尽可能分配到多的机器上面execute和CPU core 2.非spareadouta ...

  9. Android——网格布局仿计算器

    代码如下: <?xml version="1.0" encoding="utf-8"?> <GridLayout xmlns:android= ...

  10. kuangbin_ShortPath J (POJ 1511)

    其实虽然一开始有被这个题的8000MS 和 256MB限制又被吓到 但是严格来说跟之前的POJ 3268是一样的做法只是数据大了点 但是问题就出在数据大了点上 其实严格来说也不大 1e6 数组加起来大 ...