twitter bootstrap toggle オン、オフボタン

2013年3月23日更新 view: 124 view

twitterboostrap で toggleボタンを作ろう

もちろんtwitterboostrap が導入されていること前提で、以下のファイルをダウンロード。

https://github.com/nostalgiaz/bootstrap-toggle-buttons

使い方

  • bootstrapSwitch.js
  • bootstrapSwitch.css

をそれぞれ読み込み。

あとは

<div id="normal-toggle-button">
    <input id="htmlType" type="checkbox" checked="checked">
</div>

これでできあがり。

コールバック

スポンサードリンク

callbackってのは実行した後にデータを取得したり、別の処理を行うこと。
で、方法は

$('#htmlType').on('switch-change', function (e, data) {
                alert(data.value);//true or false
});

これでコールバックできます。

公式のマニュアルのコールバックが一部間違っています。
上記が正しいので公式サイトを参考にするときは注意。

詳しい使い方は

http://www.larentis.eu/www/bootstrap_toggle_buttons/

をどうぞ!

スポンサードリンク

関連記事

関連カテゴリ

コロ助

web関連の記事や制作系の記事をどんどんまとめていきます。 宜しくお願いします!

ピックアップ

パソコン・ソフトウェア ランキング

10月20日 ( 土 ) にアクセスが多かった記事はこちら!