今回は、Onsen UIons-carouselにドットナビゲーションを表示する方法を紹介します。



Monacaデバッガーの結果です。
左右にスワイプすると、該当するドットナビゲーション(白色の○)が移動します。

最初にカルーセルのitemCount分の○を作成します。
カルーセルのactiveIndexに該当するid navidot0に背景を白色に変更するクラスnavidot-checkを追加します。
postchangeイベント発火で、id navidot0のクラスnavidot-checkを削除し、id navidot1にクラスnavidot-checkを追加します。

【Monaca】Onsen UI ons-carouselにドットナビゲーションを表示する
Tagged on: