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 相关文章推荐
javascript 表单验证常见正则
Sep 28 Javascript
JQuery中getJSON的使用方法
Dec 13 Javascript
利用JS判断用户是否上网(连接网络)
Dec 23 Javascript
浅谈JavaScript中的String对象常用方法
Feb 25 Javascript
JavaScript判断用户是否对表单进行了修改的方法
Mar 18 Javascript
JS实现控制表格行文本对齐的方法
Mar 30 Javascript
AngularJS基础学习笔记之指令
May 10 Javascript
基于Bootstrap 3 JQuery及RegExp的表单验证功能
Feb 16 Javascript
微信小程序 腾讯地图SDK 获取当前地址实现解析
Aug 12 Javascript
vue中使用极验验证码的方法(附demo)
Dec 04 Javascript
深入浅析React中diff算法
May 19 Javascript
简单聊聊Vue中的计算属性和属性侦听
Oct 05 Vue.js
全面了解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
动易数据转成dedecms的php程序
2007/04/07 PHP
PHP 文件上传进度条的两种实现方法的代码
2007/11/25 PHP
简单PHP上传图片、删除图片实现代码
2010/05/12 PHP
解析coreseek for sphinx的使用
2013/06/21 PHP
使用图灵api创建微信聊天机器人
2015/07/23 PHP
Laravel Validator 实现两个或多个字段联合索引唯一
2019/05/08 PHP
jquery利用event.which方法获取键盘输入值的代码
2011/10/09 Javascript
Lua表达式和控制结构学习笔记
2014/12/15 Javascript
深入理解JavaScript系列(33):设计模式之策略模式详解
2015/03/03 Javascript
js获取页面及个元素高度、宽度的代码
2016/04/26 Javascript
Bootstrap在线电子商务网站实战项目5
2016/10/14 Javascript
jQuery ajax请求struts action实现异步刷新
2017/04/19 jQuery
Spring shiro + bootstrap + jquery.validate 实现登录、注册功能
2017/06/02 jQuery
react中使用swiper的具体方法
2018/05/15 Javascript
浅谈vue引用静态资源需要注意的事项
2018/09/28 Javascript
Layui Table js 模拟选中checkbox的例子
2019/09/03 Javascript
Nodejs + sequelize 实现增删改查操作
2020/11/07 NodeJs
python赋值操作方法分享
2013/03/23 Python
详解Python3.1版本带来的核心变化
2015/04/07 Python
Python之py2exe打包工具详解
2017/06/14 Python
python3监控CentOS磁盘空间脚本
2018/06/21 Python
python保存网页图片到本地的方法
2018/07/24 Python
python中的decorator的作用详解
2018/07/26 Python
OpenCV+python手势识别框架和实例讲解
2018/08/03 Python
正确理解Python中if __name__ == '__main__'
2019/01/24 Python
python+pyqt5编写md5生成器
2019/03/18 Python
python hough变换检测直线的实现方法
2019/07/12 Python
wxPython绘图模块wxPyPlot实现数据可视化
2019/11/19 Python
python3 字符串知识点学习笔记
2020/02/08 Python
法国亚马逊官方网站:Amazon.fr
2020/12/19 全球购物
普师专业个人自荐信范文
2013/11/26 职场文书
小学运动会演讲稿
2014/08/25 职场文书
群众路线教育实践活动对照检查材料思想汇报(副处级领导)
2014/10/04 职场文书
党员承诺书范文2015
2015/04/27 职场文书
CentOS8.4安装Redis6.2.6的详细过程
2021/11/20 Redis
《吸血鬼幸存者》新内容发布 追加多个全新模式
2022/04/07 其他游戏