no-image

JavaScript

シンプル・軽量なアナログ時計を実装できる「jsRapClock」

jsRapClockはシンプルで軽量なアナログ時計を実装できるjQueryクロックプラグインです。秒針がカチカチと動くその様子は、とてもリアルなアナログ時計にみえます。デジタル時計よりもアナログ時計の方が見慣れている人には違和感なく受け入れられそうですね。

レスポンシブにも対応

jsRapClock

デモでは2つのアナログ時計が設置されています。左側には現在時刻が、右側にはロンドンの時刻が表示されています。シンプルな時計のデザインでとてもみやすいですね。カチカチと時を刻む秒針まで描かれているところがとてもリアルで素敵です。自サイトにアナログ的な要素を取り入れたい場合にはピッタリのプラグインになるのではないでしょうか?

また、レスポンシブに対応しているところもうれしいですね。デモの画面の横幅を縮小していくとわかりますが、右側のロンドン時刻を表示する時計のサイズが画面に合わせて可変します。スマホやタブレットなどいろんなデバイスから最適なサイズで時計を表示できるのがグッドです。

オプションには、caption、shiftH、shiftMという項目が用意されています。ちなみにロンドン時刻側の時計に書かれている「London」という文字は、オプションのcaptionから任意の文字を設定できます。

というわけで、シンプル・軽量でレスポンシブにも対応したアナログ時計を実装できる「jsRapClock」の紹介でした。

関連記事

  1. no-image

    JavaScript

    超シンプルでオプションもわかりやすいjQueryスライダー「Free Simple Slider」

    Free Simple Sliderは、超シンプルで使い方も簡単なスラ…

  2. no-image

    JavaScript

    画像の遅延読み込みを実装できる軽量のJavaScriptプラグイン「justlazy.js」

    justlazy.jsは画像の遅延読み込みを実装することができるJav…

  3. jQuery Social Share Bar
  4. JavaScript

    虫メガネのようにマウスを置いた所を拡大することができるjQueryプラグイン「mlens」

    虫メガネのようにマウスを置いた所を拡大することができるjQueryプラ…

  5. Chariot

    JavaScript

    Webページ内でステップごとのガイドツアーを実装できる「Chariot」

    ChariotはWebページ内でのガイドツアーを実装することができるJ…

最近の記事

  1. BALMUDA The Pure
  2. BALMUDA The Pot Chrome

アーカイブ

PAGE TOP