jquerymobile仿微信 - 01
jquerymobile的组件感觉不咋地哇
本地调试最好是开一个web server，不然数据访问会有问题
<div data-role="page" id="weixin">
<div data-role="header" data-position="fixed">
<div class="ui-grid-b">
<div class="ui-block-a"><span class="ui-icon-arrow-l ui-btn-icon-left" style="line-height: 46px;"></span><span>微信(5)</span></div>
<div class="ui-block-b"><span class="ui-icon-search ui-btn-icon-right" style="line-height: 46px;"></span></div>
<div class="ui-block-c"><span class="ui-icon-plus ui-btn-icon-right" style="line-height: 46px;"></span></div>
</div>
</div>
<div role="main" class="ui-content" data=fullscreen="true">
<ul data-role="listview" class="ui-listview ui-corner-all ui-shadow">
<li class="ui-li-static ui-body-inherit ui-li-has-thumb ui-first-child">
<img src="imgs/user.jpg">
<h3>Broken Bells</h3>
<p>Broken Bells</p>
</li>
<li class="ui-li-static ui-body-inherit ui-li-has-thumb">
<img src="imgs/user.jpg">
<h3>Warning</h3>
<p>Hot Chip</p>
</li>
<li class="ui-li-static ui-body-inherit ui-li-has-thumb ui-last-child">
<img src="imgs/user.jpg">
<h3>Wolfgang Amadeus Phoenix</h3>
<p>Phoenix</p>
</li>
<li class="ui-li-static ui-body-inherit ui-li-has-thumb ui-first-child">
<img src="imgs/user.jpg">
<h3>Broken Bells</h3>
<p>Broken Bells</p>
</li>
<li class="ui-li-static ui-body-inherit ui-li-has-thumb">
<img src="imgs/user.jpg">
<h3>Warning</h3>
<p>Hot Chip</p>
</li>
<li class="ui-li-static ui-body-inherit ui-li-has-thumb ui-last-child">
<img src="imgs/user.jpg">
<h3>Wolfgang Amadeus Phoenix</h3>
<p>Phoenix</p>
</li>
</ul>
</div>
<div data-role="footer" data-position="fixed">
<div data-role="navbar">
<ul>
<li><a href="#" data-icon="comment" class="ui-btn-active" onclick="topage('weixin')">微信</a></li>
<li><a href="#" data-icon="bullets" onclick="topage('contacts')">通讯录</a></li>
<li><a href="#" data-icon="eye" onclick="topage('faxian')">发现</a></li>
<li><a href="#" data-icon="user" onclick="topage('wo')">我</a></li>
</ul>
</div>
</div>
</div>