no-image

JavaScript

フラットでシンプルなカラーピッカー実装「Pickr」

Pickrはフラットでシンプルなカラーピッカーを実装できるのが特徴です。レスポンシブにも対応しているほか、jQueryなどへの依存性もなくモバイルにも最適ですね。すべてのCSSフレームワークとの互換性もあるとのこと。

HEXやRGBaの値を直接入力することも可能

デモ

デモでは「Pick a color!」と書かれた四角いアイコン部分をクリックすると、カラーピッカーが表示されます。

フラットデザインを採用したカラーピッカーは、シンプルで見やすく操作も簡単でとても使いやすいです。好きな色の部分を選択して「Save」をクリックするとその色に設定できます。HEX、RGBa、HSVaの値を直接入力して色を決めることも可能です。

また、Pickrではel、default、showAlways、appendToBody、position、components、stringsなどオプションによるセッティングもいろいろできるので、カスタマイズしたい人にも嬉しい仕様になっています。ファイル容量もgzip版で8KBと軽量なところもグッドです。

Pickr

no-imageレスポンシブでマルチレベルに対応したナビゲーション「K-Responsive-Menu」前のページ

レスポンシブに対応したモーダルウィンドウのようなアラート実装「jquery.alert」次のページno-image

関連記事

  1. Jquery Line Progress Bar
  2. JavaScript

    マルチレベルで操作性に優れたレスポンシブ対応のjQueryナビゲーション

    レスポンシブに対応したマルチレベルの便利なjQueryナビゲーションが…

  3. JavaScript

    ボタンやアイコンに素敵なクリックエフェクトを実装できる「Waves」

    ボタンやアイコンに素敵なクリックエフェクトを実装することができる「Wa…

  4. no-image

    JavaScript

    グリッドレイアウトによるシンプルで軽量なギャラリー「Grid Gallery」

    Grid Galleryはグリッドレイアウトによるシンプルで軽量なイメ…

  5. flexible-bootstrap-carousel

最近の記事

  1. 蒼龍唐玉堂 特製牛バラ担々麺
  2. サーモンアボカドサラダラップとドリップ
  3. 猿田彦フレンチ
  4. Zarigani Curry 挽肉のカレー ゴーダチーズとピクルスを添えて
  5. ビジネスホテル

アーカイブ

PAGE TOP