popover.html

<div data-page="popover" class="page" style="padding: 5px 9px;">

	<!--HEADER開始-->
	<div class="navbar">
		<div class="navbar-inner">
			<div class="left">
				<a href="#" class="back link"><i class="icon icon-back"></i><span>上一頁</span></a>
			</div>
			<div class="center">
				popover
			</div>
			<div class="right">
				<a href="#" data-panel="right" class="link icon-only open-panel"><i class="icon icon-bars"></i></a>
			</div>
		</div>
	</div>
	<!--HEADER結束-->

	<!--要捲動的頁面區塊開始-->
	<div class="page-content">
	<style>
	.popover { width:200px; }
	</style>
	
	<div class="popover popover-about">
<div class="popover-angle"></div>
<div class="popover-inner">
<div class="content-block">
<p>About</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ac diam ac quam euismod porta vel a nunc. Quisque sodales scelerisque est, at porta justo cursus ac.</p>
</div>
</div>
</div>
<div class="popover popover-links">
<div class="popover-angle"></div>
<div class="popover-inner">
<div class="list-block">
<ul>
<li><a href="#" class="list-button item-link">Link 1</a></li>
<li><a href="#" class="list-button item-link">Link 2</a></li>
<li><a href="#" class="list-button item-link">Link 3</a></li>
<li><a href="#" class="list-button item-link">Link 4</a></li>
</ul>
</div>
</div>
</div>

<div class="content-block">
<p><a href="#" class="open-about">Open About Popover</a></p>
<p><a href="#" class="open-links">Open Links Popover</a></p>
<p class="">Praesent urna mi, sodales ac dolor vitae, dictum mattis sem. Mauris a dui faucibus, condimentum arcu quis, porta felis. Sed at metus arcu. Maecenas sodales tellus risus, id <a href="#" class="open-about">About</a> nibh iaculis quis. Suspendisse dignissim ante lobortis, molestie nibh id, pharetra risus. Proin blandit neque nec nibh scelerisque, eu vulputate ipsum malesuada. Phasellus sapien diam, fermentum eget ornare in, <a href="#" class="open-links">Links</a> rutrum vel justo. Integer accumsan posuere quam.</p>
<p><a href="#" class="create-about">Create Dynamic About Popover</a></p>
<p class=""><a href="#" class="create-links">Create Dynamic Links Popover</a></p>
<p class="">Praesent urna mi, sodales ac dolor vitae, dictum mattis sem. Mauris a dui faucibus, condimentum arcu quis, porta felis. Sed at metus arcu. Maecenas sodales tellus risus, id <a href="#" class="create-about">About</a> nibh iaculis quis. Suspendisse dignissim ante lobortis, molestie nibh id, pharetra risus. Proin blandit neque nec nibh scelerisque, eu vulputate ipsum malesuada. Phasellus sapien diam, fermentum eget ornare in, <a href="#" class="create-links">Links</a> rutrum vel justo. Integer accumsan posuere quam.</p>
</div>
	</div>
	<!--要捲動的頁面區塊開始-->
  
</div>