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」をチェックしてみてください。

関連記事

  1. JavaScript

    シンプルな構成で簡単に実装することができるツールチップ「jQuery PowerTip」

    とてもシンプルな構成で簡単に実装することができるjQueryプラグイン…

  2. Excolo Slider

    JavaScript

    タッチにも対応しているシンプルなjQueryスライダー「Excolo Slider」

    タッチやマウススライドにも対応しているシンプルなjQueryスライダー…

  3. jCider

    JavaScript

    レスポンシブ対応のjQueryカルーセルプラグイン実装「jCider」

    jCiderはレスポンシブ対応のシンプルなカルーセルを実装できるjQu…

  4. Intense Images
  5. PhotoJShop

    JavaScript

    写真にエフェクトやフィルタをかけることができるjQueryプラグイン「PhotoJShop」

    PhotoJShopというjQueryプラグインを使えば、写真にエフェ…

  6. Woco Accordion jQuery plugin

最近の記事

  1. TAP-F27-2KP
  2. M32ミニ
  3. CITTA TT5.0
  4. Kindle Oasis

アーカイブ

PAGE TOP