チェックボックスをさまざまなスタイルにカスタマイズするプラグイン「alt-checkbox」を紹介します。
jQueryプラグイン「alt-checkbox」
このプラグインを使えば、デフォルトの小さくてチェックしにくいチェックボックスを大きくすることができます。
また、用意されているスタイル(css)からチェックボックスルのアイコンをカスタマイズすることができます。
それではデモページのチェックボックスをご覧ください。
「alt-checkbox」のデモ
デモのソース(HTML + jQuery)
< meta name = "description" content = "alt-checkbox のデモでーす。" > |
< title >alt-checkbox - jQueryプラグイン</ title > |
< script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" ></ script > |
< script src = "jquery.alt-checkbox.js" ></ script > |
< link rel = "stylesheet" href = "jquery.alt-checkbox.icon-font.css" > |
< link rel = "stylesheet" href = "jquery.alt-checkbox.css" > |
< h1 >alt-checkbox のデモです。</ h1 > |
< span style = "font-size: 10em" > |
< input type = "checkbox" id = "demo" > |
< label for = "demo" >チェックボックス</ label > |
jQuery("#demo").altCheckbox({ |
iconClass: "fontawesome-remove" |
jsファイルのダウンロード、オプション詳細はこちらからどうぞ。