5

// 隅にいる素敵な女性への私の質問
 iOS のように、どのページが表示されているかを示すページネーションを作成したいと思います (ウィンドウの下にある小さなドットは、HIG では「ページ インジケーター」として知られています)。

分厚いベーコン

-- 私のプロジェクトは、ここに殿下と呼ばれます。

例を見つけましたが、レイアウトの再作成に関するドキュメントが見つかりません。実験セクションにあります:( http://jquerymobile.com/test/experiments/scrollview/#../../docs/ツールバー/footer-persist-a.html

4

2 に答える 2

15

なぜここが難しいと思われるのかはわかりませんが、html/css3 で円を作る方法について話しているのであれば、簡単な答えがあります。高さ/幅の半分に等しい境界線の半径でドットを作成するだけです。

<span class="dot dot1"></span>
<span class="dot dot2"></span>
<span class="dot dot3"></span>
<span class="dot dot4"></span>

...

.dot {
    display: inline-block;
    width:12px;height:12px;
    border-radius:6px;
    background-color:#8999A6;
}
.page4 .dot4 {
    background-color: white;
}

それ以上どうすればよいか分からない場合は、基本的に誰かに全部やってもらう必要がありますが、ヒントをお伝えします。上のどこかで、アクティブなページを示すクラスを設定します。これにより、一致するどのドットがアクティブであるかを示す CSS ルールをトリガーし、bg を白に変更できます。

于 2011-03-23T03:03:07.740 に答える
2

ラッセルの回答の下での議論を読んだ後、あなたが何を望んでいるのか理解できたと思います。

  1. 存在感のあるフッターを作成します。これは簡単なことではありませんが、実行できます。2 つのカラム レイアウトのプラグインhttp://jquerymobiledictionary.dyndns.org/dualColumn.htmlを参照 するか、週末に作業している間、問題を考慮に入れるのを待つことができます (これをお勧めします)。 :P).

  2. 持続的なフッターを取得したら、ページのリストからドットを生成し、pageshowイベントを処理して正しいドットを強調表示できます。

すべてをウィジェット コードにラップすることで、非グレード ブラウザのユーザーをいらいらさせるコードの山ではなく、漸進的な機能強化が可能になります。

于 2011-03-23T08:53:24.810 に答える