jQuery mobile的header和footer在点击屏幕的时候消失的解决办法


Posted in Javascript onJuly 01, 2016

jQuery Mobile简介

jQuery Mobile 是创建移动 web 应用程序的框架。

jQuery Mobile 适用于所有流行的智能手机和平板电脑。

jQuery Mobile 使用 HTML5 和 CSS3 通过尽可能少的脚本对页面进行布局。

给header和footer添加 data-position="fixed" 和 data-tap-toggle="false"即可,代码如下:

<div data-role="footer" data-position="fixed" data-tap-toggle="false">
<div data-role="navbar">
<ul>
<li><a onclick="app.show('pgJgbfMain','pgJgbfXq')">门店详情</a></li>
<li><a onclick="app.show('pgTgbf','pgJgbfXq')">备忘登记</a></li>
<li><a onclick="app.show('pgTgbf','pgJgbfXq')">退货</a></li>
<li><a onclick="app.show('pgTgbf','pgJgbfXq')">换货</a></li>
</ul>
</div> 
</div>
<!-- footer end -->

PS:jquery mobile取消header和footer点击隐藏

header 跟footer 上下两个浮动bar上,预设为 true,点击页面会消失再次点击会显示

要取消此功能

方法一:在HTML标签上加入

<div data-role="header" data-position="fixed" data-tap-toggle="false">
---content
</div>

方法二:在jQeury 加入

$("div[data-role=header],div[data-role=footer]").fixedtoolbar({
tapToggle:false
});

以上所述是小编给大家介绍的jQuery mobile的header和footer在点击屏幕的时候消失的解决办法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js函数获取html中className所在的内容并去除标签
Sep 08 Javascript
extjs每个组件要设置唯一的ID否则会出错
Jun 15 Javascript
JS合并数组的几种方法及优劣比较
Sep 19 Javascript
基于jQuery通过jQuery.form.js插件使用ajax提交form表单
Aug 17 Javascript
JS响应鼠标点击实现两个滑块区间拖动效果
Oct 26 Javascript
使用Node.js处理前端代码文件的编码问题
Feb 16 Javascript
Angularjs 滚动加载更多数据
Mar 17 Javascript
jQuery常用的一些技巧汇总
Mar 26 Javascript
layui表格实现代码
May 20 Javascript
JS学习笔记之闭包小案例分析
May 29 Javascript
JavaScript实现沿五角星形线摆动的小圆实例详解
Jul 28 Javascript
vue解决跨域问题(推荐)
Nov 10 Javascript
全面了解JavaScript的数据类型转换
Jul 01 #Javascript
全面解析JS字符串和正则表达式中的match、replace、exec等函数
Jul 01 #Javascript
浅谈JavaScript中的分支结构
Jul 01 #Javascript
Bootstrap下拉菜单效果实例代码分享
Jun 30 #Javascript
Bootstrap图片轮播组件使用实例解析
Jun 30 #Javascript
Bootstrap编写一个在当前网页弹出可关闭的对话框 非弹窗
Jun 30 #Javascript
Bootstrap编写一个同时适用于PC、平板、手机的登陆页面
Jun 30 #Javascript
You might like
vBulletin HACK----显示话题大小和打开新窗口于论坛索引页
2006/10/09 PHP
php简单实现文件或图片强制下载的方法
2016/12/06 PHP
浅谈PHP中pack、unpack的详细用法
2018/03/12 PHP
ThinkPHP框架中使用Memcached缓存数据的方法
2018/03/31 PHP
JavaScript加密解密7种方法总结分析
2007/10/07 Javascript
EXT中xtype的含义分析
2010/01/07 Javascript
8款非常棒的响应式jQuery 幻灯片插件推荐
2012/02/02 Javascript
jquery ajax请求实例深入解析
2012/11/26 Javascript
JS小功能(操作Table--动态添加删除表格及数据)实现代码
2013/11/28 Javascript
Jquery给基本控件的取值、赋值示例
2014/05/23 Javascript
基于JavaScript代码实现pc与手机之间的跳转
2015/12/23 Javascript
在Html中使用Requirejs进行模块化开发实例详解
2016/04/15 Javascript
jquery.form.js框架实现文件上传功能案例解析(springmvc)
2016/05/26 Javascript
json的使用小结
2016/06/08 Javascript
Bootstrap实现带动画过渡的弹出框
2016/08/09 Javascript
js方法数据验证的简单实例
2016/09/17 Javascript
对Angular.js Controller如何进行单元测试
2016/10/25 Javascript
JavaScript实现水平进度条拖拽效果
2017/01/18 Javascript
jquery实时获取时间的简单实例
2017/01/26 Javascript
jQuery实现的回车触发按钮事件功能示例
2018/03/25 jQuery
vue实现选中效果
2020/10/07 Javascript
react antd表格中渲染一张或多张图片的实例
2020/10/28 Javascript
Python 用三行代码提取PDF表格数据
2019/10/13 Python
Python计算信息熵实例
2020/06/18 Python
Python2.x与3​​.x版本有哪些区别
2020/07/09 Python
解决pip install psycopg2出错问题
2020/07/09 Python
深入浅析HTML5中的SVG
2015/11/27 HTML / CSS
TIME时代杂志台湾总代理:台时亚洲
2018/10/22 全球购物
医院总经理职责
2013/12/26 职场文书
一个独生女的故事观后感
2015/06/04 职场文书
工作经历证明范本
2015/06/15 职场文书
总经理聘用协议书
2015/09/21 职场文书
《思路决定出路》读后感3篇
2019/12/11 职场文书
PHP使用QR Code生成二维码实例
2021/07/07 PHP
Mysql排查分析慢sql之explain实战案例
2022/04/19 MySQL
解决Windows Server2012 R2 无法安装 .NET Framework 3.5
2022/04/29 Servers