jquery mobile transition
RUN
<!DOCTYPE HTML> <html> <head> <title>Transition</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> </head> <body> <div data-role="page" id="init"> <div data-role="header"> <h1>Transition</h1> </div> <div role="main" class="ui-content"> <p>jQuery Mobile Transition</p> <p> <a href="#intro" data-transition="fade" class="ui-btn ui-btn-inline">Fade</a> <a href="#intro" data-transition="pop" class="ui-btn ui-btn-inline">Pop</a> <a href="#intro" data-transition="flip" class="ui-btn ui-btn-inline">Flip</a> <a href="#intro" data-transition="turn" class="ui-btn ui-btn-inline">Turn</a> <a href="#intro" data-transition="flow" class="ui-btn ui-btn-inline">Flow</a> <a href="#intro" data-transition="slidefade" class="ui-btn ui-btn-inline">SlideFade</a> <a href="#intro" data-transition="slide" class="ui-btn ui-btn-inline">Slide</a> <a href="#intro" data-transition="slideup" class="ui-btn ui-btn-inline">Slideup</a> <a href="#intro" data-transition="slidedown" class="ui-btn ui-btn-inline">Slidedown</a> <a href="#intro" data-transition="none" class="ui-btn ui-btn-inline">None</a> </p> </div> <div data-role="footer"> <h2>Author: thehalfheart</h2> </div> </div> <div data-role="page" id="intro"> <div data-role="header"> <h1>Lời giới thiệu</h1> </div> <div role="main" class="ui-content"> <p> jQuery Mobile Framework cho phép bạn chuyển trang với nhiều hiệu ứng khác nhau dựa vào CSS3 Transitions, bạn có thể áp dụng cho mọi liên kết chuyển trang giữa các page tĩnh hoặc có sử dụng Ajax. </p> <p> <a href="#init">Trở về</a> </p> </div> <div data-role="footer"> <h2>Author: thehalfheart</h2> </div> </div> </body> </html>
PHÓNG TO