首页 > Web开发 > 详细

jQuery Mobile

时间:2015-08-17 00:53:19      阅读:298      评论:0      收藏:0      [点我收藏+]

jQuery Mobile

jQuery Mobile 是创建移动 web 应用程序的框架。

jQuery Mobile 适用于所有流行的智能手机和平板电脑。

jQuery Mobile 使用 HTML5 和 CSS3 通过尽可能少的脚本对页面进行布局。

 

实例

<div data-role="page" id="pageone">
  <div data-role="header">
    <h1>在此处写入标题</h1>
  </div>

  <div data-role="content">
    <p>在此处写入正文</p>
  </div>

  <div data-role="footer">
    <h1>在此处写入页脚文本</h1>
  </div>
</div> 

jQuery Mobile 是一个为触控优化的框架,用于创建移动 web 应用程序。

jQuery 适用于所有流行的智能手机和平板电脑

jQuery Mobile 安装

下载 jQuery Mobile

<head>
<link rel=stylesheet href=jquery.mobile-1.3.2.css>
<script src=jquery.js></script>
<script src=jquery.mobile-1.3.2.js></script>
</head>

页面实例

<body>
<div data-role="page">

  <div data-role="header">
    <h1>欢迎访问我的主页</h1>
  </div>

  <div data-role="content">
    <p>我是一名移动开发者!</p>
  </div>

  <div data-role="footer">
    <h1>页脚文本</h1>
  </div>

</div>
</body>
  • data-role="page" 是显示在浏览器中的页面
  • data-role="header" 创建页面上方的工具栏(常用于标题和搜索按钮)
  • data-role="content" 定义页面的内容,比如文本、图像、表单和按钮,等等
  • data-role="footer" 创建页面底部的工具栏

添加页面

<div data-role="page" id="pageone">
  <div data-role="content">
    <a href="#pagetwo">转到页面二</a>
  </div>
</div>

<div data-role="page" id="pagetwo">
  <div data-role="content">
    <a href="#pageone">转到页面一</a>
  </div>
</div>

jQuery Mobile

原文:http://www.cnblogs.com/bellow/p/4735339.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!