Home > Developer > Web Develop
Recently the company has a project is to develop a mobile page-based application, where the need to improve the place is: try to make this look like an application, so it involves the page effect of the problem. Since the previously contacted frame is jquery mobile, it is used directly. The problem has just been solved initially, in a total of three steps.
The first step, in order to avoid the HTML link jump between the mishap, the app only left one HTML. That is, all the sub-pages are implemented using the "Page + id" method, with "a href = ' #xx '" to achieve the jump. The light is still not enough, so the second step: "position= ' fixed '" on each page is deleted (if any). At this point still some disappointments: page jump or not smooth, the effect comes out when there is a lag. The final third step: Add "data-prefetch=" to the link above "true", this role is prefetching and caching, to improve the effect of jump.
Others to modify the CSS code to hide the background of the way to repair, personally think it should be possible, but for performance should not help.
Because of the haste of time, so the general writing to share, the words have no place, or a piece of code to end:
1 <HTML>2 <Body>3 <DivData-role= "page"ID= "Page1">4 5 <ul>6 <Li><ahref= "#page1"class= "Ui-btn-active ui-state-persist">First page</a></Li>7 <Li><ahref= "#page2"data-transition= "Flip"Data-prefetch= "Ture">Second page</a></Li>8 <Li><ahref= "#page3"data-transition= "Slide"Data-prefetch= "Ture">Third page</a></Li> 9 </ul>Ten One </Div> A - <DivData-role= "page"ID= "Page2"> - the <ul> - <Li><ahref= "#page1"data-transition= "Turn"Data-prefetch= "Ture">First page</a></Li> - <Li><ahref= "#page2"class= "Ui-btn-active ui-state-persist"Data-prefetch= "Ture">Second page</a></Li> - <Li><ahref= "#page3"data-transition= "Pop"Data-prefetch= "Ture">Third page</a></Li> + </ul> - + </Div> A at <DivData-role= "page"ID= "Page3"> - - <ul> - <Li><ahref= "#page1"data-transition= "Turn"Data-prefetch= "Ture">First page</a></Li> - <Li><ahref= "#page2"data-transition= "Slideup"Data-prefetch= "Ture">Second page</a></Li> - <Li><ahref= "#page3"class= "Ui-btn-active ui-state-persist">Third page</a></Li> in </ul> - to </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
