jquerymobile-8 Dialog
来源:互联网 发布:服务器域名根目录 编辑:程序博客网 时间:2024/06/06 02:16
在开发的过程中,我们可能需要使用到模态的对话框,在jquerymobile中这个实现很简单,只需要给一个普通的链接添加data-rel="dialog"这样的属性就可以了。下面给出一个例子代码:
- <!DOCTYPE html>
- <html>
- <head>
- <title>Dialog Test</title>
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />
- <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
- <script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>
- </head>
- <body>
- <div data-role="page" id="first">
- <div data-role="header">
- <h1>Dialog Test</h1>
- </div>
- <div data-role="content">
- <p>
- <a href="#page3" data-rel="dialog">A Dialog (dialog)</a>
- </p>
- </div>
- </div>
- <div data-role="page" id="page3">
- <div data-role="header">
- <h1>The Dialog</h1>
- </div>
- <div data-role="content">
- <p>
- This is the Dialog
- </p>
- </div>
- </div>
- </body>
- </html>
页面显示如下:
点击后显示:
我们可以在这个Dialog页面添加更加复杂的内容,这个就可以当成一个页面去进行编写,只是跳转的方式不同而已。
- jquerymobile-8 Dialog
- jquerymobile-18 Dialog
- jquerymobile
- jqueryMobile
- jQueryMobile
- jquerymobile-8 List简单使用
- jqueryMobile+phoneGap
- jquerymobile 研究
- jquerymobile 基础教程
- jquerymobile实例
- jqueryMobile+backbone
- JQueryMobile 基础
- jquerymobile 小记
- hello jQueryMobile
- jquerymobile 起航
- jquerymobile API
- JqueryMobile Demo
- JQueryMobile学习
- Android使用adb指令在虚拟机中安装、卸载apk程序
- Error:No suitable device found: no device found for connection "System eth1" .
- Android Matrix理论与使用详解
- 程序员你应该懂得谦虚
- [转]正则表达式(一)
- jquerymobile-8 Dialog
- syscall open
- 浅析:做优质外链的一些方法
- 向量积(叉积)及其计算
- CoreText 绘制 表情,链接,图片等
- libRTMP使用说明
- linux下多线程和信号处理
- [转]常用正则表达(二)
- 黑马程序员 — JavaScript