兄弟会精英班 - 学习笔记(九)

jQuery Mobile 前端架构

基于手机页面的前端架构,响应式布局,JS扩展。

jQuery Mobile 安装

  1. jQuery Mobile 官网 下载 稳定版;
  2. jQuery 官网 下载 jQuery Mobile所对应的jQuery.js ;
  3. 提取jQuery Mobile中的压缩版js文件、css文件和image文件夹,以及第二步的jQuery.js文件 ;

基本布局

  1. 引入jQuery Mobile 和 jQuery的css和js文件;
  2. 布局页眉,内容和页脚;
    //当作一个页面
    //页面头部

    欢迎访问我的主页

    //页面内容

    我是一名移动开发者!

    //页脚

    页脚文本

页脚扩展

  • 底部导航制作

data-role = "navbar" 创建底部导航
data-position = "fixed" 固定到屏幕底部;
data-transition = "fade" 页面过渡;
data-icon 图标内容

你可能感兴趣的:(兄弟会精英班 - 学习笔记(九))