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 相关文章推荐
Web开发者必备的12款超赞jQuery插件
Dec 03 Javascript
jQuery 过滤not()与filter()实例代码
May 10 Javascript
Jquery注册事件实现方法
May 18 Javascript
ECMAScript6中Map/WeakMap详解
Jun 12 Javascript
jQuery+css实现的蓝色水平二级导航菜单效果代码
Sep 11 Javascript
基于Bootstrap里面的Button dropdown打造自定义select
May 30 Javascript
AngularJS解决ng界面长表达式(ui-set)的方法分析
Nov 07 Javascript
Angular使用操作事件指令ng-click传多个参数示例
Mar 27 Javascript
小程序实现多列选择器
Feb 15 Javascript
微信小程序 scroll-view 水平滚动实现过程解析
Oct 12 Javascript
JS实现普通轮播图特效
Jan 01 Javascript
js绘制一条直线并旋转45度
Aug 21 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获得客户端浏览器名称及版本的方法(基于ECShop函数)
2015/12/23 PHP
PHP图像裁剪缩略裁切类源码及使用方法
2016/01/07 PHP
PHP 表单提交及处理表单数据详解及实例
2016/12/27 PHP
JavaScript中void(0)的具体含义解释
2007/02/27 Javascript
(推荐一个超好的JS函数库)S.Sams Lifexperience ScriptClassLib
2007/04/29 Javascript
extjs 为某个事件设置拦截器
2010/01/15 Javascript
JSQL 批量图片切换的实现代码
2010/05/05 Javascript
addEventListener和attachEvent二者绑定的执行函数中的this不相同
2012/12/09 Javascript
jquery获取颜色在ie和ff下的区别示例介绍
2014/03/28 Javascript
javascript实现的固定位置悬浮窗口实例
2015/04/30 Javascript
使用AngularJS中的SCE来防止XSS攻击的方法
2015/06/18 Javascript
jQuery切换所有复选框选中状态的方法
2015/07/02 Javascript
Bootstrap CSS组件之面包屑导航(breadcrumb)
2016/12/17 Javascript
微信jssdk逻辑在vue中的运用详解
2018/11/14 Javascript
Angular6 用户自定义标签开发的实现方法
2019/01/08 Javascript
layui禁用侧边导航栏点击事件的解决方法
2019/09/25 Javascript
js代码编写无缝轮播图
2020/09/13 Javascript
[03:09]DOTA2亚洲邀请赛 LGD战队出场宣传片
2015/02/07 DOTA
python备份文件的脚本
2008/08/11 Python
跟老齐学Python之总结参数的传递
2014/10/10 Python
python制作一个桌面便签软件
2015/08/09 Python
Python实现按当前日期(年、月、日)创建多级目录的方法
2018/04/26 Python
JSON文件及Python对JSON文件的读写操作
2018/10/07 Python
python、Matlab求定积分的实现
2019/11/20 Python
如何在django中运行scrapy框架
2020/04/22 Python
python 读取二进制 显示图片案例
2020/04/24 Python
Python+logging输出到屏幕将log日志写入文件
2020/11/11 Python
CSS Grid布局教程之什么是网格布局
2014/12/30 HTML / CSS
html5 Canvas绘制线条 closePath()实例代码
2012/05/10 HTML / CSS
卡塔尔航空官方网站:Qatar Airways
2017/02/08 全球购物
美国香薰蜡烛品牌:PADDYWAX
2018/10/06 全球购物
俄罗斯最大的在线手表商店:Bestwatch.ru
2020/01/11 全球购物
关于Assembly命名空间的三个面试题
2015/07/23 面试题
2019学生会干事辞职信
2019/06/27 职场文书
Go 自定义package包设置与导入操作
2021/05/06 Golang
【海涛教你打DOTA】剑圣第一人称视角解说
2022/04/01 DOTA