jQueryのモバイルページ2024 年の最新の入門チュートリアル。このコースでは 学習のjQuery Mobileを起動します,例,ページ内のjQuery Mobileを追加,例,ダイアログの用途としてページ,例, について学習できます。
jQueryのモバイルページ
学習のjQuery Mobileを起動します
| jQueryのモバイルは、すべてのモバイルデバイスと互換性がありますが、(これは限られたCSS3のサポートに)PCとの完全な互換性はありませんが。
よりよいこのチュートリアルを読むためには、我々はあなたがGoogle Chromeブラウザを使用することをお勧めします。 |
---|
例
<body>
<div data-role="page" >
<div
data-role="header" >
<h1>欢迎来到我的主页</h1>
</div>
<div data-role="main" class="ui-content" >
<p>我现在是一个移动端开发者!!</p>
</div>
<div data-role="footer" >
<h1>底部文本</h1>
</div>
</div>
</body>
»をお試しください 分析の例:
- データ-役割= "ページ"を表示するには、ブラウザでページです。
- データ-役割= "ヘッダが"(通常はタイトルや検索ボタンに使用)が作成されたページの上部にあるツールバーです
- データ-役割は= "メイン"などというように、テキスト、画像、フォーム、ボタンとして、ページの内容を定義します。
- このページのパディングとマージンのための「UI-コンテンツ」クラス。
- ページ・ツールバーの下部を作成するために使用されるデータ・役割= "フッター"。
- 段落、写真、見出し、リストなど - これらのコンテナでは、任意のHTML要素を追加することができます
| jQueryのモバイルは、HTML5のデーターに依存している*さまざまなUI要素、移行、およびページ構造をサポートするための属性。 ブラウザは、彼らは黙って破棄され、それらをサポートしていません。 |
---|
ページ内のjQuery Mobileを追加
jQueryのモバイルを使用して、あなたはその後、別のページ数での単一のHTMLファイルを作成することができます。
あなたはページの同じ一意のIDを使用して区別するために別のhref属性を使用することができます。
例
<divのデータ役割= "ページ" ID = "pageone">
<DIVデータ-役割= "メイン"クラス= "UI-コンテンツ」>
第二ページ</a>にジャンプするの<a href="#pagetwo">
</ DIV>
</ DIV>
<divのデータ役割= "ページ" ID = "pagetwo">
<DIVデータ-役割= "メイン"クラス= "UI-コンテンツ」>
最初のページ</a>にジャンプするの<a href="#pageone">
</ DIV>
</ DIV>
»をお試しください 注意:Webアプリケーションは、コンテンツ(テキスト、画像、スクリプトなど)の多くを持っているときに真剣にロード時間に影響を与えます。 あなたは、ページ内のリンクを使用したくない場合は、外部ファイルを使用することができます。
<a href="externalfile">访问外部文件</a>
ダイアログの用途としてページ
ダイアログボックスは、ページ情報の表示や入力フォーム情報を表示するために使用されます。
データのrel = "ダイアログ"ポップアップダイアログボックスは、ユーザーがリンクをクリックすることを可能にするリンクに追加します。
例
<DIVデータ-役割= "ページ" ID = "pageone">
<DIVデータ-役割= "メイン"クラス= "UI-コンテンツ」>
第二ページ</a>に<a href="#pagetwo">ジャンプ
</ DIV>
</ DIV>
<divのデータ役割= "ページ"データダイアログ= "true"をID = "pagetwo">
<DIVデータ-役割= "メイン"クラス= "UI-コンテンツ」>
最初のページ</a>に<a href="#pageone">ジャンプ
</ DIV>
</ DIV>
»をお試しください