rcSwitcher 介绍
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' } });
rcSwitcher 官网
https://github.com/ahmad-sa3d/rcswitcher
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。