Home >Web Front-end >JS Tutorial >Getting Started with jquery Mobile—Studying Multiple Page Switching Examples_jquery

Getting Started with jquery Mobile—Studying Multiple Page Switching Examples_jquery

WBOY
WBOYOriginal
2016-05-16 17:44:051557browse

1. In JQuery Mobile , switching between multiple pages is performed through the element and setting the attribute to the corresponding id number of #.

2. Multi-page switching sample code :

Copy code The code is as follows:




New Document







JQuery Mobile< ;/h1>



This is the homepage


Detailed page






JQuery Mobile



3I Studio Copyright






3. Rendering preview :


Clicking on the details page will switch to another page:


4. In addition to internal links , there are also external links. The implementation method is the same as internal links, except that another rel attribute is added to and the attribute value is set to external Indicates external links, such as:

Copy code The code is as follows:

5. To switch the page with animation effect , just add data in -transition attribute, such as:
Copy code The code is as follows:

Details page //Open the page with a pop-up effect

slide: sliding from right to left Animation effect
pop: open the page with a pop-up effect
slideup: slide up animation effect
slidedown: slide down animation effect
fade: gradient fade effect
flip: fly in The effect of
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn