rcSwitcher (Radio Checkbox Switcher) 是一款能够让单选框和复选框转换成开关的 jQuery 插件,它能让你的收音机看起来更加漂亮。
代码示例:
// convert all checkboxs to switchs $('input[type=checkbox]').rcSwitcher(); // Options $('input[type=checkbox]').rcSwitcher({ // Default value // info theme: 'flat', // light select theme between 'flat, light, dark, modern' width: 80, // 56 in 'px' height: 26, // 22 blobOffset: 0, // 2 reverse: true, // false reverse on off order onText: 'YES', // 'ON' text displayed on ON state offText: 'NO', // 'OFF' text displayed on OFF state inputs: true, // false show corresponding inputs autoFontSize: true, // false auto fit text size with respect to switch height autoStick: true // false auto stick switch to its parent side }); // assign event handler $(':radio').rcSwitcher().on({ 'turnon.rcSwitcher': function( e, dataObj ){ // to do on turning on a switch // dataObj.$input current input jq object // dataObj.$switcher current switch jq object // dataObj.components.$toggler swich toggler jq object // dataObj.components.$on switch on jq object // dataObj.components.$off switch off jq object // dataObj.components.$blob switch blob jq object }, 'turnoff.rcSwitcher': function( e, dataObj ){ // to do on turning off a switch }, 'change.rcSwitcher': function( e, dataObj, changeType ){ // to do on turning on or off a switch // changeType is 'turnon' || 'turnoff' } });