app开发作为一种新的趋势，在app开发中有很多中框架，而appframework作为jquery mobel版的改进版，比jquery 更快，体积跟小，而且兼容各种设备，前端采用htm5。
使用appframework开发app，其实很简单。
定义简单的app
<head>
<title>App Framework single page</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes" />
<link rel="stylesheet" type="text/css" href="appframework-2.0/css/icons.css" />
<link rel="stylesheet" type="text/css" href="appframework-2.0/css/afui.css" />
引入相应的js
<script type="text/javascript" src="appframework.js"></script> <script type="text/javascript" src="ui/appframework.ui.min.js"></script>
添加头部
<div id="header">
<h1>Single Page App</h1>
</div>
添加内容：
<div id="content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
添加页脚：
div id="navbar">
<a href="#home" id='navbar_home' class='icon home'>home</a>
<a href="#sketch" id='navbar_pencil' class='icon pencil'>Sketch</a>
<a href="#picture" id='navbar_picture' class='icon picture'>Picture</a>
</div>
效果预览
头部，内容，页脚都是可以变化的。在内容的左边还可以显示可自动隐藏菜单。头部和页脚可以根据内容的不同自动变换。
原创文章，作者：奋斗，如若转载，请注明出处：https://blog.ytso.com/5285.html