コミュニティ
学ぶ
ツールライブラリ
AIツール
レジャー
検索
日本語
ホームページ > ウェブフロントエンド > jsチュートリアル > jquery Mobile の入門 — 複数のページ切り替えの学習 Examples_jquery

jquery Mobile の入門 — 複数のページ切り替えの学習 Examples_jquery

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
リリース： 2016-05-16 17:44:05
オリジナル
1625 人が閲覧しました

1. JQuery Mobile では、 要素を使用して、 属性を # に設定します。

2. 複数ページ切り替えのサンプルコード :

コードをコピー コードは次のとおりです。



< ;TITLE> 新しいドキュメント






h1>JQuery Mobile

これはホームページです

>

詳細ページ



著作権: 3I Studio



header data-role="header">

JQuery Mobile


p> ;詳細ページです


ホームページに戻る

🎜 >

3I Studio Copyright


;/HTML>



3. レンダリング プレビュー
:




詳細ページをクリックすると別のページに切り替わります:


4. 内部リンク

に加えて、外部リンクもあります。実装方法は、 に別の rel 属性が追加される点が異なります。外部に設定 次のような外部リンクを示します:


コードをコピー

コードは次のとおりです:

詳細ページ 5. アニメーション効果のあるページを切り替えるには -transition 属性にデータを追加します。例:


コードをコピー

コードは次のとおりです:
詳細ページ //ポップアップ効果のあるページを開きますslide: 右から左にスライド アニメーション効果 Pop: ポップアップ効果でページを開きます slideup: 上にスライドするアニメーション効果 slidedown: 下にスライドするアニメーション効果
フェード: グラデーションフェード効果
フリップ: 飛び込み
の効果
関連ラベル：
mobile ページ切り替え
前の記事：javascript_javascriptスキルにおけるString.match()とRegExp.exec()の違いの説明 次の記事：JavaScript システム フォルダー ファイル操作とパラメーター_JavaScript スキルの概要
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
angular.js - コントローラー層メソッドによって読み取られた配列は、$scope の下のオブジェクトに割り当てられます。オブジェクトはページにバインドされています。なぜ、配列の内容がページ上に表示されないのでしょうか。
から 1970-01-01 08:00:00
0
0
0
コメント ウェブページを開いた直後にセクション if(result === true){} が応答しないのはなぜですか?
から 1970-01-01 08:00:00
0
0
0
親愛なる皆さん、質問したいことがあります。ディレクトリを選択するたびに、対応する画像がポップアップ表示されます。どうすればよいですか?
から 1970-01-01 08:00:00
0
0
0
画面サイズ/デバイスに基づいて適切な CSS スタイルを選択する方法
から 1970-01-01 08:00:00
0
0
0
object-c - MultipeerConnectivity 讨论
から 1970-01-01 08:00:00
0
0
0
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート