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中的float运算精度实例分析
Aug 21 Javascript
原生javascript实现图片轮播效果代码
Sep 03 Javascript
onsubmit阻止form表单提交与onclick的相关操作
Sep 03 Javascript
原生js写的放大镜效果
Aug 22 Javascript
jquery数据验证插件(自制,简单,练手)实例代码
Oct 24 Javascript
调试JavaScript中正则表达式中遇到的问题
Jan 27 Javascript
jQuery获取页面及个元素高度、宽度的总结——超实用
Jul 28 Javascript
jquery ajax双击div可直接修改div中的内容
Mar 04 Javascript
js中获取jsp表单中radio类型的值简单实例
Aug 15 Javascript
在小程序开发中使用npm的方法
Oct 17 Javascript
关于Vue Router中路由守卫的应用及在全局导航守卫中检查元字段的方法
Dec 09 Javascript
bootstrap-table后端分页功能完整实例
Jun 01 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
php 字符串函数收集
2010/03/29 PHP
PHP下利用shell后台运行PHP脚本,并获取该脚本的Process ID的代码
2011/09/19 PHP
用 Composer构建自己的 PHP 框架之设计 MVC
2014/10/30 PHP
php中钩子(hook)的原理与简单应用demo示例
2019/09/03 PHP
Laravel jwt 多表(多用户端)验证隔离的实现
2019/12/18 PHP
tp5框架前台无限极导航菜单类实现方法分析
2020/03/29 PHP
PPK 谈 JavaScript 的 this 关键字 [翻译]
2009/09/29 Javascript
仿新浪微博登陆邮箱提示效果的js代码
2013/08/02 Javascript
理解javascript中的回调函数(callback)
2014/09/02 Javascript
javascript中返回顶部按钮的实现
2015/05/05 Javascript
AngularJS基础学习笔记之指令
2015/05/10 Javascript
jQuery对象与DOM对象转换方法详解
2016/05/10 Javascript
artDialog+plupload实现多文件上传
2016/07/19 Javascript
vue.js绑定事件监听器示例【基于v-on事件绑定】
2018/07/07 Javascript
微信小程序按钮去除边框线分享页面功能
2018/08/27 Javascript
小程序实现左滑删除功能
2018/10/30 Javascript
vue动态配置模板 'component is'代码
2019/07/04 Javascript
详解JS预解析原理
2020/06/16 Javascript
vue实现简单图片上传
2020/06/30 Javascript
[52:44]VGJ.T vs infamous Supermajor小组赛D组败者组第一轮 BO3 第一场 6.3
2018/06/04 DOTA
[04:00]黄浦江畔,再会英雄——完美世界DOTA2 TI9应援视频
2019/07/31 DOTA
Request的中断和ErrorHandler实例解析
2018/02/12 Python
Django中提示消息messages的设置方式
2019/11/15 Python
Python发送手机动态验证码代码实例
2020/02/28 Python
Django封装交互接口代码
2020/07/12 Python
CSS3圆角和渐变2种常用功能详解
2016/01/06 HTML / CSS
斐乐美国官方网站:FILA美国
2019/03/01 全球购物
个人找工作求职简历的自我评价
2013/10/20 职场文书
说明书范文
2014/05/07 职场文书
奥巴马竞选演讲稿
2014/05/15 职场文书
校园活动策划方案
2014/06/13 职场文书
女生抽烟检讨书
2014/10/05 职场文书
2016新年年会主持词
2015/07/06 职场文书
Vue Element UI自定义描述列表组件
2021/05/18 Vue.js
分析Netty直接内存原理及应用
2021/06/14 Java/Android
利用python做数据拟合详情
2021/11/17 Python