カウントアップカウンター-Volar2
SIRIUS2テンプレート【Volar2】では【パーツ】→＜アイテム比較＞を利用したカウントアップカウンターを作成できます。
【Volar2】では【パーツ】→＜アイテム比較＞を利用して、可視領域に達したらカウントアップするカウンター機能を実装してます。
デモはトップページでご覧になれます。
※＜アイテム比較＞についてはこちらの記事をご参照ください。
操作方法
やり方はこの機能を使いたいページの【個別ページの設定】を開き、［詳細設定］タブの『</body>タグ前に挿入する内容』のところに【Volar2】で用意しているモジュールを挿入します。
次に【パーツ】→＜アイテム比較＞を開いて指定箇所に表示したい内容を記入します。
（説明文は省略可・価格欄には専用のコードをコピー＆ペースト）
記入が済んだら独自タグで出力します。
その独自タグを【Volar2】で用意している専用のクラスで囲みます。
<div class="xxx">[% compare(※アイテム比較管理名) %]</div>
これでトップページのサンプルのようなカウンターが表示されます。
（実際にはアニメーションしながら表示）
カウンターが見える位置までスクロールしたらカウントアップのアニメーションが始まります。
アニメーションは1回限りでページをリロード（更新）すれば再度アニメーションします。
数値の色や大きさは変更可。
「タイプ01」でのみ利用可。
『カウントアップカウンター』の関連記事
-
SIRIUS2テンプレート【Volar2】にはテーブル（表）のデータの背景にアイコンをつけたりセル幅を自在に調節できたりする便利な機能が搭載されてます -
SIRIUS2テンプレート【Volar2】では画像をクリックすると拡大表示できる機能を搭載してます。 -
SIRIUS2テンプレート【Volar2】では通常のヘッダーエリアを動画ヘッダーに簡単に切り替えることができます。 -
SIRIUS2テンプレート【Volar2】では通常のヘッダーエリアをフェード切り替え画像スライダーに簡単に切り替えることができます。 -
SIRIUS2テンプレート【Volar2】の1カラムページで使える＜フルワイド背景画像＞についての詳細ページ。 -
SIRIUS2テンプレート【Volar2】のテキスト周りを彩る＜独自の装飾効果＞についての詳細ページ。 -
SIRIUS2テンプレート【Volar2】なら＜まっさらなLPページ＞を作るのも簡単。 -
SIRIUS2テンプレート【Volar2】では人気記事1位～4位までをコンテンツ上部に自動表示させることができます。