首頁 > web前端 > js教程 > jquery Mobile入門—多頁面切換範例學習_jquery

jquery Mobile入門—多頁面切換範例學習_jquery

WBOY
發布: 2016-05-16 17:44:05
原創
1587 人瀏覽過

1、在JQuery Mobile中,多個頁面的切換是透過元素、並將屬性設定為# 對應的id號的方式進行的。

2、多頁切換範例程式碼

複製程式碼 程式碼🎜>


New Document







JQuery Mobile



這是首頁


詳細頁



3I工作室版權所有




JQuery Mobile



這裡是詳細頁

回首頁



3I工作室版權所有







3、效果圖預覽


點擊詳細頁將切換到另一頁:


4、除了內鏈接外

,還有外鏈接,實現方法與內鏈接相同,只是在中增加了另外一個rel屬性,並將該屬性值設為external表示外鏈,如:

詳細頁



5、動畫效果切換頁
,只需在中加入data-transition屬性,如:
詳細頁 //以彈出的效果打開頁面


slide:從右到左滑動的動畫效果
pop:以彈出的效果開啟頁面
slideup:向上滑動的動畫效果
slidedown:向下滑動的動畫效果
fade:漸變褪色的效果
flip:飛入的效果
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板