CSS Jquery Pie Countdown Timer

JavaScript

グラデーションが美しい円形カウントダウン「CSS Jquery Pie Countdown Timer」

円形によるカウントダウンのタイマーを実装する「CSS Jquery Pie Countdown Timer」をご紹介します。linear-gradientを活用した美しいグラデーションのデザインがとても印象的です。

CSS Jquery Pie Countdown Timer

CSS Jquery Pie Countdown Timer

デモでは円形バーが中央に表示されている数字のカウントとともに伸びて行きます。カウントが終了すると円形バーもキレイな円を描き終了します。linear-gradientによるグラデーションがとても美しいですね。見た目もシンプルなのでカウントダウンに集中できそうです。

カウントダウンの総数は「totaltime」という変数に格納されているので、ここを変更することで好きな値に設定可能です。

デザイン・機能ともにシンプルな分、いろんなシチュエーションで活用しやすいカウントダウンタイマーに仕上がっているのではないでしょうか?

というわけで、美しいグラデーションによるカウントダウンタイマーを実装したいという人は、ぜひ「CSS Jquery Pie Countdown Timer」をチェックしてみてください。

Progressively画像を徐々に読み込んでくれるJSライブラリ「Progressively」前のページ

CSSのフィルターをコントロールできるjQueryプラグイン「Philter」次のページPhilter

最近の記事

  1. 縦置きスタンド
  2. スマトラ
  3. さくらドーナツ
PAGE TOP