Loading, please wait...

ARTDESIGN CLASSIC RADIO

SETTINGS

Attributes

data-plugin-ad-classic-radio="ad-classic-radio"

This attribute is required in order to applied the plugin on the desired element
<div data-plugin-ad-classic-radio="ad-classic-radio">
    <input type="radio" name="Radio" value="Radio 1" data-ad-classic-radio-label="Radio 1" checked="checked"/>
    <input type="radio" name="Radio" value="Radio 2" data-ad-classic-radio-label="Radio 2"/>
    <input type="radio" name="Radio" value="Radio 3" data-ad-classic-radio-label="Radio 3"/>
</div>

data-ad-classic-radio-options="ForceVertical"

This attribute overwrites the settings of the plugin only for the specific element
<div data-plugin-ad-classic-radio="ad-classic-radio" data-ad-classic-radio-options="ForceVertical">
    <input type="radio" name="Radio" value="Radio 1" data-ad-classic-radio-label="Radio 1" checked="checked"/>
    <input type="radio" name="Radio" value="Radio 2" data-ad-classic-radio-label="Radio 2"/>
    <input type="radio" name="Radio" value="Radio 3" data-ad-classic-radio-label="Radio 3"/>
</div>

data-ad-classic-radio-button-options="ClassicRadioFullColorDefault, ClassicRadioBlue"

This attribute overwrites the settings of the ArtDesign Button only for the concrete element
<div data-plugin-ad-classic-radio="ad-classic-radio" data-ad-classic-radio-button-options="ClassicRadioFullColorDefault, ClassicRadioBlue">
    <input type="radio" name="Radio" value="Radio 1" data-ad-classic-radio-label="Radio 1" checked="checked"/>
    <input type="radio" name="Radio" value="Radio 2" data-ad-classic-radio-label="Radio 2"/>
    <input type="radio" name="Radio" value="Radio 3" data-ad-classic-radio-label="Radio 3"/>
</div>

data-ad-classic-radio-label="Label"

This attribute set label
<div data-plugin-ad-classic-radio="ad-classic-radio">
    <input type="radio" name="Radio" value="Radio 1" data-ad-classic-radio-label="Radio 1" checked="checked"/>
    <input type="radio" name="Radio" value="Radio 2" data-ad-classic-radio-label="Radio 2"/>
    <input type="radio" name="Radio" value="Radio 3" data-ad-classic-radio-label="Radio 3"/>
</div>

checked="checked"

This attribute makes the radio button active
<div data-plugin-ad-classic-radio="ad-classic-radio">
    <input type="radio" name="Radio" value="Radio 1" data-ad-classic-radio-label="Radio 1" checked="checked"/>
    <input type="radio" name="Radio" value="Radio 2" data-ad-classic-radio-label="Radio 2"/>
    <input type="radio" name="Radio" value="Radio 3" data-ad-classic-radio-label="Radio 3"/>
</div>

disabled="disabled"

This attribute activates the disable mode
<div data-plugin-ad-classic-radio="ad-classic-radio" disabled="disabled">
    <input type="radio" name="Radio" value="Radio 1" data-ad-classic-radio-label="Radio 1"/>
    <input type="radio" name="Radio" value="Radio 2" data-ad-classic-radio-label="Radio 2"/>
    <input type="radio" name="Radio" value="Radio 3" data-ad-classic-radio-label="Radio 3"/>
</div>

Public Methods

Destroy

<script type="text/javascript">
    var ClassicRadio = $(".ArtDesign").ArtDesignClassicRadio();
    ClassicRadio.Destroy();
</script>

Default Options

<script type="text/javascript">
    General: { // General settings of the element
        ClassPrefix: "CR_" // Put ClassPrefix on the style of the element in order to prevent a conflict with other styles from external CSS file; Must be string; By default: "CR_"
    },
    Global: { // Global settings of the element
        Float: "", // Positions element to the left or right; Must be string (left, right); By default: ""
        AnimationSpeed: 0.3, // Set the AnimationSpeed; Must be decimal; By default: 0.3
        ButtonOptions: "ClassicRadioDefault" // ClassicRadio PlugIn use the Button PlugIn and set the default style; Must be string; By default: "ClassicRadioDefault"
    },
    BrowserSupport: { // Settings for the browser support
        Chrome: 20, // Indicates the require minimum version of the Chrome browser; Must be integer; By default: 20
        Mozilla: 20, // Indicates the require minimum version of the Mozilla browser; Must be integer; By default: 20
        Opera: 20, // Indicates the require minimum version of the Opera browser; Must be integer; By default: 20
        Safari: 5, // Indicates the require minimum version of the Safari browser; Must be integer; By default: 5
        MSIE: 9, // Indicates the require minimum version of the MSIE browser; Must be integer; By default: 9
        MSEdge: 12 // Indicates the require minimum version of the MSEdge browser; Must be integer; By default: 12
    },
    Elements: { // Settings for the elements
        Position: "Left", // Set the position of the element; Must be string (Left or Right) By default: "Left"
        Structure: "Horizontal", // Set the default structure of the Radio Buttons; Must be string; By default: "Horizontal"
        VerticalSpace: "10px" // Set the vertical space between the elements; Must be string; By default: "10px"
    },
    Icons: { // Settings for the Icons
        Icon: "icon-check-1", // Set the Icon from the ArtDesignIcons PlugIn; Must be string; By default: "icon-check-1"
        MarginHorizontal: "10px" // Set the horizontal margin of the element; Must be string (px, %, auto); By default: "10px"
    },
    Labels: { // Settings for the Labels
        Labels: true, // If it is true, it sets the following settings; By default: true
        PaddingTop: "2px", // Set the top padding of the element; Must be string (px, %, auto); By default: "2px"
        MarginHorizontal: "20px", // Set the horizontal margin of the element; Must be string (px, %, auto); By default: "20px"
        Cursor: "pointer", // Set Cursor style on CSS; Must be string; By default: "pointer"
        Animation: true, // If it is true, it sets the animation of the element: By default: true
        FontFamily: "sans-serif", // Set the FontFamily property which specifies the font for an element; Must be serif, sans-serif or monospace; By default: "sans-serif"
        FontSize: "14px", // Set the size of the font; Must be string; By default: "14px"
        FontWeight: "normal", // Set the weight of the font; Must be string (normal, bold, bolder, lighter, number, initial, inherit); By default: "normal"
        FontStyle: "normal", // Set the style of the font; Must be string (normal, italic, oblique, initial, inherit); By default: "normal"
        LineHeight: "1.2em", // The line-height property specifies the line height of the element, negative values are not allowed; Must be integer or decimal; By default: "1.2em"
        Normal: {
            Color: "#719AC1" // Normal color; By default: "#719AC1"
        },
        Hover: {
            Color: "#52708C" // Normal color; By default: "#52708C"
        },
        Click: {
            Color: "#52708C" // Normal color; By default: "#52708C"
        }
    }
</script>