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 相关文章推荐
翻译整理的jQuery使用查询手册
Mar 07 Javascript
extjs 学习笔记(二) Ext.Element类
Oct 13 Javascript
editable.js 基于jquery的表格的编辑插件
Oct 24 Javascript
HTTP 304错误的详细讲解
Nov 13 Javascript
LABjs、RequireJS、SeaJS的区别
Mar 04 Javascript
JS图片左右无缝隙滚动的实现(兼容IE,Firefox 遵循W3C标准)
Sep 23 Javascript
深入探究node之Transform
Jul 20 Javascript
jQuery实现的简单动态添加、删除表格功能示例
Sep 21 jQuery
详解vue-cli 3.0 build包太大导致首屏过长的解决方案
Nov 10 Javascript
基于vue实现圆形菜单栏组件
Jul 05 Javascript
js动态获取时间的方法分析
Aug 02 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
Sep 28 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
使用PHPMYADMIN操作mysql数据库添加新用户和数据库的方法
2010/04/02 PHP
PHP按行读取、处理较大CSV文件的代码实例
2014/04/09 PHP
PHP实现的字符串匹配算法示例【sunday算法】
2017/12/19 PHP
PHP模型Model类封装数据库操作示例
2019/03/14 PHP
php命名空间设计思想、用法与缺点分析
2019/07/17 PHP
Javascript 实用小技巧
2010/04/07 Javascript
js下通过getList函数实现分页效果的代码
2010/09/17 Javascript
JS维吉尼亚密码算法实现代码
2010/11/09 Javascript
jquery一句话全选/取消全选
2011/03/01 Javascript
jQuery Ajax请求状态管理器打包
2012/05/03 Javascript
html超链接打开窗口大小的方法
2013/03/05 Javascript
一个支持任意尺寸的图片上下左右滑动效果
2014/08/24 Javascript
ie8下修改input的type属性报错的解决方法
2014/09/16 Javascript
cookie的secure属性详解
2015/04/08 Javascript
js实现点击按钮后给Div图层设置随机背景颜色的方法
2015/05/06 Javascript
js获得当前系统日期时间的方法
2015/05/06 Javascript
javascript实现倒计时并弹窗提示特效
2015/06/05 Javascript
js实现Select头像选择实时预览代码
2015/08/17 Javascript
noty ? jQuery通知插件全面解析
2016/05/18 Javascript
angular+ionic 的app上拉加载更新数据实现方法
2017/01/16 Javascript
Node.js+jade抓取博客所有文章生成静态html文件的实例
2017/09/19 Javascript
改变layer confirm弹窗按钮的颜色方法
2019/09/12 Javascript
重置Redux的状态数据的方法实现
2019/11/18 Javascript
Vue数据双向绑定底层实现原理
2019/11/22 Javascript
[00:19]CN DOTA NEVER DIE!VG夺冠rOtK接受采访
2019/12/23 DOTA
python-str,list,set间的转换实例
2018/06/27 Python
wxPython实现画图板
2020/08/27 Python
canvas实现滑动验证的实现示例
2020/08/11 HTML / CSS
非凡女性奢华谦虚风格:The Modist
2017/10/28 全球购物
实习教师自我鉴定
2013/12/12 职场文书
英文简历中的自荐信范文
2013/12/14 职场文书
建筑人员岗位职责
2013/12/25 职场文书
高三英语教学反思
2014/01/13 职场文书
家长会欢迎标语
2014/06/24 职场文书
党员个人剖析材料(四风问题)
2014/10/07 职场文书
兵马俑导游词
2015/02/02 职场文书