Loading, please wait...

ARTDESIGN TEXT AREA

SETTINGS

Attributes

data-plugin-ad-text-area="ad-text-area"

This attribute is required in order to applied the plugin on the desired element
<textarea data-plugin-ad-text-area="ad-text-area"></textarea>

data-ad-text-area-options="OuterShadow, FullBlue"

This attribute overwrites the settings of the plugin only for the concrete element
<textarea data-plugin-ad-text-area="ad-text-area" data-ad-text-area-options="OuterShadow, FullBlue"></textarea>

data-ad-text-area-icon="icon-info"

This attribute adds an icon to the button
<textarea data-plugin-ad-text-area="ad-text-area" data-ad-text-area-icon="icon-info"></textarea>

disabled="disabled"

This attribute activates disable mode
<textarea data-plugin-ad-text-area="ad-text-area" disabled="disabled"></textarea>

Public Methods

Destroy

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

Default Options

<script type="text/javascript">
    General: { // General settings of the element
        ClassPrefix: "TA_" // 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: "TA_"
    },
    Global: { // Global settings of the element
        MaxWidth: "800px", // Set the MaxWidth of the element; Must be string (px, %, auto); By default: "800px"
        Width: "100%", // Set the Width of the element; Must be string (px, %, auto); By default: "100%"
        Height: "200px", // Set the Height of the element; Must be string (px, %, auto); By default: "200px"
        PaddingTop: "15px", // Set the top padding of the element; Must be string (px, %, auto); By default: "15px"
        PaddingBottom: "15px", // Set the bottom padding of the element; Must be string (px, %, auto); By default: "15px"
        PaddingLeft: "30px", // Set the left padding of the element; Must be string (px, %, auto); By default: "30px"
        PaddingRight: "30px", // Set the right padding of the element; Must be string (px, %, auto); By default: "30px"
        Float: "", // Positions element to the left or right; Must be string (left, right); By default: ""
        Cursor: "text", // Set Cursor style on CSS; Must be string; By default: "text"
        CursorDisabled: "not-allowed", // Set Cursor style on CSS while it is on the disabled mode; Must be string; By default: "not-allowed"
        OpacityDisabled: 0.8, // Set the opacity of the element while it is on the disabled mode; Must be decimal; By default: 0.8
        AnimationSpeed: 0.4, // Set the AnimationSpeed; Must be decimal; By default: 0.4
        ScrollBarTheme: "DefaultDropDown", // When the content of the DropDown menu is bigger it activates ScrollBar PlugIn; Must be string; By default: "DefaultDropDown"
        ZIndex: 1 // It specifies the stack order of an elements; Must be integer or string (auto, initial, inherit); By default: 1
    },
    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
    },
    MainBackground: { // Setting for the MainBackground colors animation
        Animation: true, // If it is true, it sets the following settings for MainBackground colors animation; normal, hover and click; By default: true
        Normal: {
            BackgroundColor: "transparent" // Normal background color without gradient; By default: "transparent"
        },
        Hover: {
            BackgroundColor: "transparent" // Hover background color without gradient; By default: "transparent"
        },
        Click: {
            BackgroundColor: "transparent" // Click background color without gradient; By default: "transparent"
        }
    },
    Text: { // Settings of the text of the element
        Animation: true, // If it is true, it sets the following settings for Text animation; 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.5em", // The line-height property specifies the line height of the element, negative values are not allowed; Must be integer or decimal; By default: "1.5em"
        TextAlign: "left", // Set the text-align property which specifies the horizontal alignment of text in an element; Must the string (left, right, center, justify, initial, inherit); By default: "left"
        Normal: {
            Color: "#719AC1" // Normal color; By default: "#719AC1"
        },
        Hover: {
            Color: "#52708C" // Hover color without gradient; By default: "#52708C"
        },
        Click: {
            Color: "#52708C" // Click color; By default: "#52708C"
        }
    },
    Icon: { // Setting for the Icon
        Animation: true, // If it is true, it sets the following settings for Icon animation; By default: true
        Position: "Left", // Set the position of the element; Must be string (Left or Right); By default: "Left"
        FontSize: "16px", // Set the size of the font; Must be string; By default: "14px"
        PaddingHorizontal: "10px", // Set the horizontal padding of the element; Must be string (px, %, auto); By default: "10px"
        PaddingTop: "4px", // Set the top padding of the element; Must be string (px, %, auto); By default: "4px"
        Normal: {
            Color: "#719AC1" // Normal color; By default: "#52708C"
        },
        Hover: {
            Color: "#52708C" // Hover color without gradient; By default: "#52708C"
        },
        Click: {
            Color: "#52708C" // Click color; By default: "#52708C"
        }
    },
    Background: { //Settings for the background animation of the element
        Animation: false, // If it is true, it sets the following settings for Background animation; By default: false
        Normal: { // background setting for Normal mode(for different browsers)
            BackgroundColor: "transparent",
            MozLinearGradient: "-moz-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            WebkitGradient: "-webkit-gradient(left top, left bottom, color-stop(0%, rgba(transparent)), color-stop(100%, rgba(transparent)))",
            WebkitLinearGradient: "-webkit-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            OLinearGradient: "-o-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            MSLinearGradient: "-ms-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            LinearGradient: "linear-gradient(to bottom, rgba(transparent) 0%, rgba(transparent) 100%)",
            FilterGradient: "progid:DXImageTransform.Microsoft.gradient(startColorstr='transparent', endColorstr='transparent', GradientType=0)"
        },
        Hover: { // background setting for Hover mode(for different browsers)
            BackgroundColor: "transparent",
            MozLinearGradient: "-moz-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            WebkitGradient: "-webkit-gradient(left top, left bottom, color-stop(0%, rgba(transparent)), color-stop(100%, rgba(transparent)))",
            WebkitLinearGradient: "-webkit-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            OLinearGradient: "-o-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            MSLinearGradient: "-ms-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            LinearGradient: "linear-gradient(to bottom, rgba(transparent) 0%, rgba(transparent) 100%)",
            FilterGradient: "progid:DXImageTransform.Microsoft.gradient(startColorstr='transparent', endColorstr='transparent', GradientType=0)"
        },
        Click: { // background setting for Click mode(for different browsers)
            BackgroundColor: "transparent",
            MozLinearGradient: "-moz-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            WebkitGradient: "-webkit-gradient(left top, left bottom, color-stop(0%, rgba(transparent)), color-stop(100%, rgba(transparent)))",
            WebkitLinearGradient: "-webkit-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            OLinearGradient: "-o-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            MSLinearGradient: "-ms-linear-gradient(top, rgba(transparent) 0%, rgba(transparent) 100%)",
            LinearGradient: "linear-gradient(to bottom, rgba(transparent) 0%, rgba(transparent) 100%)",
            FilterGradient: "progid:DXImageTransform.Microsoft.gradient(startColorstr='transparent', endColorstr='transparent', GradientType=0)"
        }
    },
    Shadow: { // Settings for the Shadow of the element
        Outer: { // Setting for the outer shadow of the element
            Animation: false, // If it is true it sets the following settings for normal, hover and click; By default: false
            Normal: {
                Shadow: "0px 0px 0px 0px rgba(0, 0, 0, 0)"
            },
            Hover: {
                Shadow: "0px 0px 0px 0px rgba(0, 0, 0, 0)"
            },
            Click: {
                Shadow: "0px 0px 0px 0px rgba(0, 0, 0, 0)"
            }
        },
        Inner: { // Setting for the inner shadow of the element
            Animation: false, // If it is true it sets the following settings for normal, hover and click; By default: false
            Normal: {
                Shadow: "inset 0px 0px 0px 0px rgba(0, 0, 0, 0)"
            },
            Hover: {
                Shadow: "inset 0px 0px 0px 0px rgba(0, 0, 0, 0)"
            },
            Click: {
                Shadow: "inset 0px 0px 0px 0px rgba(0, 0, 0, 0)"
            }
        }
    },
    Border: { // Settings for the animation of the Border
        Animation: true, // If it is true it set the following settings for normal, hover and click; By Default: true
        BorderStyle: "solid", // Set the BorderStyle; Must be String; By default: "solid"
        Normal: { // Settings for Normal BorderStyle animation
            BorderWidth: "1px", // Set the BorderWidth; Must be String; By default: "1px"
            BorderRadius: "0px", // Set the BorderRadius; Must be String; By default: "0px"
            BorderRadiusInner: "0px", // Set the BorderRadiusInner; Must be String; By default: "0px"
            BorderColor: "#719AC1" // Set the BorderColor; Must be String; By default: "#719AC1"
        },
        Hover: { // Settings for Hover BorderStyle animation
            BorderWidth: "1px", // Set the BorderWidth; Must be String; By default: "1px"
            BorderRadius: "0px", // Set the BorderRadius; Must be String; By default: "0px"
            BorderRadiusInner: "0px", // Set the BorderRadiusInner; Must be String; By default: "0px"
            BorderColor: "#52708C" // Set the BorderColor; Must be String; By default: "#52708C"
        },
        Click: { // Settings for Click BorderStyle animation
            BorderWidth: "1px", // Set the BorderWidth; Must be String; By default: "1px"
            BorderRadius: "0px", // Set the BorderRadius; Must be String; By default: "0px"
            BorderRadiusInner: "0px", // Set the BorderRadiusInner; Must be String; By default: "0px"
            BorderColor: "#52708C" // Set the BorderColor; Must be String; By default: "#52708C"
        }
    },
    WaterMark: { // Settings for Water Mark
        Left: -4, // Set Left position; Must be integer; By default: -4
        Top: 0, // Set Top position; Must be integer; By default: -4
        FallBack: false
    }
</script>