转换单／复选框功能的插件 rcSwitcher

• 授权协议: GPLv3
• 开发语言: JavaScript HTML/CSS
• 操作系统: 跨平台
• 软件首页: https://github.com/ahmad-sa3d/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'
    }

});

本文地址：https://www.codercto.com/soft/d/22692.html