app Framework入门基础知识

一个最基本的panel    

<div id="home" class="panel">
  <h3>home</h3>
  <p>Home panel</p>
</div>
   
panel的属性介绍： 
    selected="true" 可以是这个panel变成默认的panel，在app启动时，用户首先看到的便是这个panel，有些类似webform中的起始页，winform中的启动项。 
    modal="true"   有点类似于模式弹出窗口，但弹出后，会占居整个屏幕，登录页面就应该使用。 
例如： 
<div class="panel" id="login" modal="true"> </div> <!-- Modal window -->

1、data-header="id"  自定义header 
2、data-footer="id"  自定义footer
3、data-nav="id"     左侧的导航条

4、data-defer="filename.html"  官方文档是可以根据设置的地址给panel加载内容。官方说可以使用远程地址，但我测试，似乎不行，但本地是可以的。远程就要涉及一个跨域访问的问题。目前还不知道如何加载远程的内容。


5、data-tab="anchor_id"   在此panel显示时，将选中footer中id为anchor_id的选项。

6、data-load="func_name"  在panel加载后，执行的方法。有点类似为winform中的formload函数，初步试验，这个方法在panel每次是当前内容时，也就是在当前页面时都会执行。

7、data-unload="func_name"  在panelunload后执行的方法

8、title="home"    官方文档没有，可以设定header的显示的内容。

<div id="navbar"> 是默认的下方导航

<aside>
	This is a chat aside 这是侧边哦——www.chishaokao.com
</aside>

<nav id="menu_AppFramework">
	定义左侧滑动导航 通过data-nav="id"调用
</nav>

<nav></nav>定义全局导航。

<div id="splashscreen"></div>定义加载闪屏的内容。

<div id="header">
 	定义默认头部
</div>

<div id="navbar">
	定义默认底部导航
</div>

<footer id='footerui'> 自定义底部
    <a href="#main" id='navbar_home' class='icon home'>首页 <span class='af-badge lr'>6</span></a>
    <a href="#aftransitions" id='navbar_js' class="icon stack">Trans</a>
    <a href="#afuidemo" id='navbar_ui' class="icon picture">ui</a>
    <a href="#uiapi" id='navbar_plugins' class="icon info">api</a>
</footer>

<header id="testheader">自定义头部
    <a id="backButton" οnclick="$.ui.goBack()" class='button'>Back</a>
        <h1>自定义header</h1>
    <a class="button icon settings" style="float:right">Button</a>
</header>

转载自： http://m.blog.csdn.net/blog/qq996150938/44656251#