1.7.jquerymobile--返回按鈕


1data-add-back-btn="true" data-back-btn-text="返回"

 

 

<!DOCTYPE html> 
<html> 
<html lang="zh-CN">
	<head> 
	<title>1.7.jquerymobile--返回按鈕</title> 
	<meta charset="utf-8"/>
	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<link rel="stylesheet" href="jquery.mobile-1.0.1.css" />
	<script src="jquery.js"></script>
	<script src="jquery.mobile-1.0.1.js"></script>
</head> 
<body> 
	<!--這是主頁面-->
	<section id="homepage" data-role="page">
		

			<header data-role="header">
				<h1>主頁</h1>
			</header><!-- /header -->

			<div data-role="content">	
				<p><a href="#gallery">畫廊</a></p><!--data-transition="slidedown"頁面轉換效果-->
				<p><a href="#contact">聯系</a></p>
				<p>主頁</p>		
			</div><!-- /content -->
			
			<footer data-role="footer" data-role="fixed" data-id="nav"><!--data-role="fixed"固定頁腳-->
				<div class="navmain" data-role="navbar">
					<ul>
						<li><a href="#homepage" class="ui-btn-active ui-state-persist">主頁</a></li><!--class="ui-btn-active ui-state-persist"當前頁面導航高亮顯示-->
						<li><a href="#gallery" data-transition="pop">畫廊</a></li>
						<li><a href="#contact" data-transition="flip">聯系</a></li>
					</ul>
				</div>
			</footer>
			
			
	</section><!-- /page -->
	<!--這是畫廊頁面-->
	<section id="gallery" data-role="page" data-add-back-btn="true" data-back-btn-text="返回">
		

			<header data-role="header">
				<h1>畫廊</h1>
			</header><!-- /header -->

			<div data-role="content">	
				<p><a href="#homepage" data-transition="slideup">主頁</a></p>
				<p>畫廊</p>		
			</div><!-- /content -->
			
			<footer data-role="footer" data-role="fixed" data-id="nav">
				<div class="navmain" data-role="navbar">
					<ul>
						<li><a href="#homepage" data-transition="flip">主頁</a></li>
						<li><a href="#gallery" class="ui-btn-active ui-state-persist">畫廊</a></li>
						<li><a href="#contact" data-transition="flip" data-direction="reverse">聯系</a></li><!--data-direction="reverse"-->
					</ul>
				</div>
			</footer><!-- /footer -->
			
			
	</section><!-- /page -->
	<!--這是聯系頁面-->
	<section id="contact" data-role="page">
		

			<header data-role="header">
				<h1>聯系</h1>
			</header><!-- /header -->

			<div data-role="content">	
				<p><a href="#homepage">主頁</a></p>
				<p>聯系</p>		
			</div><!-- /content -->
			
			<footer data-role="footer" data-role="fixed" data-id="nav">
				<div class="navmain" data-role="navbar">
					<ul>
						<li><a href="#homepage" data-transition="flip">主頁</a></li>
						<li><a href="#gallery" data-transition="flip">畫廊</a></li>
						<li><a href="#contact" class="ui-btn-active ui-state-persist">聯系</a></li>
					</ul>
				</div>
			</footer><!-- /footer -->
			
			
	</section><!-- /page -->
</body>
</html>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM