jQuery Moblile Demos学习记录Panel
本文来源于www.ifyao.com禁止转载!www.ifyao.com
我就简短的总结一下:
Panel位置:data-position属性控制:值:left,right,
显示方式:data-display属性 值:reveal默认在页面之下,overlay页面上,push和页面统一,将页面推开。
Panel应该放在header,content,footer之前或者之后,但是不能再page外面。
比如这样
当想要动态添加content或者是隐藏的内容可见是,应该触发事件:
$( "#mypanel" ).trigger( "updatelayout" );
框架会检查panel的高度,当content的高度超过了屏幕的高度时,它将会被设置成min-height,同时,panel会滚动。
data-swipe-close="false"可以设置Panel打开后不能通过点击页面关闭Panel
data-dismissible="false"
panel里面添加一个按钮, 加上data-rel="close"可以关闭Panel
data-animate="false"关闭panel动画
data-position-fixed="true"会防止panel滚动和无法访问。
overflow有可能只显示没有被绝对定位的Panel。
当Panel内的菜单内容太长以至于超出屏幕宽度时,fixed状态会被取消,使得Panel可以滚动。
框架,panel用DIV包含,class="ui-panel-inner" 默认有15个像素padding
Panel有一个固定宽度17em
可以在Panel框架上添加data-theme或者设置data-theme="none"并设置自己的样式。注意加Padding。
以上内容取自官方demo,本人翻译,未经允许禁止转载!
本文来源于www.ifyao.com禁止转载!www.ifyao.com
jQuery Moblile Demos学习记录Panel的更多相关文章
- jQuery Moblile Demos学习记录Theming、Button、Icons图标,脑子真的不好使。
jQuery Moblile Demos学习记录Theming.Button.Icons图标,脑子真的不好使. 06. 二 / Jquery Mobile 前端 / 没有评论 本文来源于www.i ...
- 【jQuery】精细学习记录
[jQuery]精细学习记录 基础 基本语法: $(选择器).action(回调函数); $/jQuery //jQuery核心函数 $(选择器) //获得的jQuery对象 jQuery核心 - j ...
- 关于jquery.noConflict()的学习记录
今天无意中看到了jquery.noConfict()的实现方法 代码如下: var // Map over jQuery in case of overwrite _jQuery = window.j ...
- 20170811 JQuery基础知识学习记录(一)
基本写法 $(selector).action() $(this).hide() - 隐藏当前元素 $("p").hide() - 隐藏所有 <p> 元素 $(&quo ...
- Jquery基础教程第二版学习记录
本文仅为个人jquery基础的学习,简单的记录以备忘. 在线手册:http://www.php100.com/manual/jquery/第一章:jquery入门基础jquery知识:jquery能做 ...
- 【Bootstrap5】精细学习记录
[Bootstrap5]精细学习记录 Bootstrap模板 <!DOCTYPE html> <html> <head> <title>Bootstra ...
- D3.js学习记录【转】【新】
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Echarts学习记录——如何去掉网格线及网格区域颜色
关键属性 splitLine和splitArea,可以设置相关的属性 示例代码 <!DOCTYPE html> <html lang="en"> <h ...
- Echarts学习记录——如何给x轴文字标签添加事件
Echarts学习记录——如何给x轴文字标签添加事件 关键属性 axisLabel下属性clickable:true 并给图表添加单击事件 根据返回值判断点击的是哪里 感觉自己的方法有点变扭,有更好办 ...
随机推荐
- mysql分库分表总结<转>
单库单表 单库单表是最常见的数据库设计,例如,有一张用户(user)表放在数据库db中,所有的用户都可以在db库中的user表中查到. 单库多表 随着用户数量的增加,user表的数据量会越来越大,当数 ...
- PHP数组foreach后使用current取值的问题
先看如下的代码 $arr=['a','b','c']; foreach ($arr as $v){ echo $v.'<br>'; } var_dump(current($arr)); 今 ...
- C# .net Jquery ajax 简单示例
jquery中ajax相信大家都不陌生,这里只写个简单例子示意用法,详细后续再写. 在html中按钮事件中添加如下js var param = "data=" + escape($ ...
- Json.Net从4.0升级到7.0带来的问题
1.由于被迫Json.Net升级,导致了我们一部分查询出来数据 2.分析原因result = JsonConvert.DeserializeObject(inputContent, JsonDataT ...
- LDD命令--可执行文件依赖的库出现错误时
http://littlepig3056.blog.163.com/blog/static/180758353201212751814134/ ldd 查看可执行文件依赖的库,结果会列出依赖的库名及 ...
- No enclosing instance of type test8 is accessible. Must qualify the allocation with an enclosing instance of type test8 (e.g. x.new A() where x is an
在编译一个例子时,结果编译时出现: No enclosing instance of type test8 is accessible. Must qualify the allocation wit ...
- Effective Java2读书笔记-类和接口(三)
第17条:要么为继承而设计,并提供文档说明,要么就禁止继承 第18条:接口优于抽象类 这两条中,提到了一个很重要的概念骨架实现.也就是说,抽象类实现接口的形式.这样的好处是,接口本来不能提供默认的实现 ...
- 5.1.1 读取Redis 数据
Redis 服务器是Logstash 推荐的Broker选择,Broker 角色就意味会同时存在输入和输出两个插件. 5.1.1 读取Redis 数据 LogStash::Input::Redis 支 ...
- 3Sum Closest 解答
Question Given an array S of n integers, find three integers in S such that the sum is closest to a ...
- 使用Open Flash Chart(OFC)制作图表(Struts2处理)
Java开源项目中制作图表比较出色的就是JFreeChart了,相信大家都听说过,它不仅可以做出非常漂亮的柱状图,饼状图,折线图基本图形之外,还能制作甘特图,仪表盘等图表.在Web应用中可以为项目增色 ...