jQWidgets Forums

jQuery UI Widgets › Forums › Editors › MaskedInput › Custom round corner masked input

Tagged: 

This topic contains 2 replies, has 2 voices, and was last updated by  bronson 12 years, 1 month ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Custom round corner masked input Posts
  • April 18, 2013 at 7:13 am Custom round corner masked input #19504

    bronson
    Participant

    Hi every body,

    I’ve tried for a while to custom corner for masked input.
    According to the documentation I’ve tried to set my theme like jqx-input-rc-all-Mytheme in the custom CSS (Radius to 0) but no work at all.

    What the breakthrough for this ?

    Tks to everybody

    April 18, 2013 at 9:04 am Custom round corner masked input #19516

    support
    Participant

    Hi Bronson,

    Please take a look at the following example:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <style>
       #numericInput
    {
        -moz-border-radius: 0px;
        -webkit-border-radius: 0px;
        border-radius: 0px;
    }
       </style>
        
       
        <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
        <script type="text/javascript" src="../../scripts/gettheme.js"></script>
        <script type="text/javascript" src="../../scripts/jquery-1.9.0.min.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxmaskedinput.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                var theme = getDemoTheme();
                // Create jqxMaskedInputs
                $("#numericInput").jqxMaskedInput({ width: '250px', height: '25px', theme: theme });
               
              
            });
        </script>
    </head>
    <body class='default'>
        <div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
            <div style='margin-top: 10px;'>
                Numeric</div>
            <div style='margin-top: 3px;' id='numericInput'>
            </div>
           
        </div>
    </body>
    </html>

    Best Wishes,
    Mariya

    jQWidgets Team
    http://www.jqwidgets.com

    April 18, 2013 at 2:37 pm Custom round corner masked input #19554

    bronson
    Participant

    Thank U mariya,
    I’ll have a look.

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.