標籤：style blog class code java ext
jQuery Mobile 擁有一系列關於如何從一頁過渡到下一頁的效果。前提是瀏覽器必須支援 CSS3 3D 轉換：
瀏覽器支援過渡效果可應用於任意連結或通過使用 data-transition 屬性進行的表單提交：
下面的表格展示了可與 data-transition 屬性一同使用的可用過渡：
以上所有效果同時支援反向動作，例如，如果您希望頁面從左向右滑動，而不是從右向左，請使用值為 "reverse" 的 data-direction 屬性。在後退按鈕上是預設的。
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title></title></head><link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css"><script src="http://code.jquery.com/jquery-1.8.3.min.js"></script><script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script></head><body> <div data-role="page" id="pageone"> <div data-role="header"> <h1>HEADER</h1> </div> <div data-role="content"> <p>點選連結來查看滑動效果</p> <a href="#pagetwo" data-transition="slide">滑動到頁面二</a> </div> <div data-role="footer"> <h1>FOOTER</h1> </div> </div> <div data-role="page" id="pagetwo"> <div data-role="header"> <h1>我是一個對話方塊！</h1> </div> <div data-role="content"> <p>點選連結來查看滑動效果</p> <a href="#pageone" data-transition="slide">滑動到頁面一</a><!--加上該屬性data-direction="reverse" 可以實現反向滑動--> </div> <div data-role="footer"> <h1>頁尾文本</h1> </div></div> </body></html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
