PhoneGap中文网

 找回密码
 立即注册
查看: 823538|回复: 1435
打印 上一主题 下一主题

第九讲 phonegap 教程 Jquery Mobile 面板(panel)详解

  [复制链接]

493

主题

2035

帖子

6894

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6894
跳转到指定楼层
楼主
发表于 2013-9-28 23:27:49 | 只看该作者 |只看大图 回帖奖励 |倒序浏览 |阅读模式
高清视屏教程下载地址:

http://yun.baidu.com/s/1pJEztPL


课件以及源码下载地址:

游客,如果您要查看本帖隐藏内容请回复



1. 面板具有灵活的设计,可以用于导航,注册登录,以及更多。可以实现几乎data-role="content" 完成的所有功能 用data-role="panel"来定义
data-display=“reveal” ,默认值,将页面像幻灯片一样从屏幕划出,将面板显示出来
data-display="overlay",面板出现在页面内容顶部上层。
data-display="push",是同时“推动”的面板和页面。

手指左右触摸  实现面板显示与隐藏js 代码
  1. <script>
  2.                 $( document ).on( "pageinit", "#demo-page", function() {

  3.                         $( document ).on( "swipeleft swiperight", "#demo-page", function( e ) {
  4.                                 // We check if there is no open panel on the page because otherwise
  5.                                 // a swipe to close the left panel would also open the right panel (and v.v.).
  6.                                 // We do this by checking the data that the framework stores on the page element (panel: open).
  7.                                 if ( $.mobile.activePage.jqmData( "panel" ) !== "open" ) {
  8.                                         if ( e.type === "swipeleft"  ) {
  9.                                                 $( "#right-panel" ).panel( "open" );
  10.                                         } else if ( e.type === "swiperight" ) {
  11.                                                 $( "#left-panel" ).panel( "open" );
  12.                                         }
  13.                                 }
  14.                         });
  15.                 });
  16.     </script>
复制代码


回复

使用道具 举报

1

主题

19

帖子

73

积分

注册会员

Rank: 2

积分
73
沙发
发表于 2013-9-29 00:16:38 | 只看该作者
怎么都不能下载了
回复 支持 反对

使用道具 举报

0

主题

16

帖子

86

积分

注册会员

Rank: 2

积分
86
板凳
发表于 2013-9-29 00:26:35 | 只看该作者
不管东西咋样 还是先谢谢了
回复 支持 反对

使用道具 举报

493

主题

2035

帖子

6894

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6894
5#
 楼主| 发表于 2013-9-29 11:07:36 | 只看该作者
mailawu 发表于 2013-9-29 00:16
怎么都不能下载了

可以下载的 亲
回复 支持 反对

使用道具 举报

0

主题

9

帖子

52

积分

注册会员

Rank: 2

积分
52
6#
发表于 2013-9-29 11:21:46 | 只看该作者
看看效果先
回复 支持 反对

使用道具 举报

0

主题

10

帖子

50

积分

注册会员

Rank: 2

积分
50
7#
发表于 2013-9-29 12:50:59 | 只看该作者
看看效果先
回复 支持 反对

使用道具 举报

0

主题

19

帖子

50

积分

注册会员

Rank: 2

积分
50
8#
发表于 2013-9-29 13:31:34 | 只看该作者
卡萨诺说可能是是
回复 支持 反对

使用道具 举报

0

主题

17

帖子

206

积分

中级会员

Rank: 3Rank: 3

积分
206
10#
发表于 2013-9-29 14:44:54 | 只看该作者
不管东西咋样 还是先谢谢了
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

站长推荐 上一条 /1 下一条

ionic4视频教程

Archiver|手机版|小黑屋| PhoneGap中文网 ( 京ICP备13027796号-1 )  

GMT+8, 2024-11-5 23:32 , Processed in 0.087456 second(s), 33 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表