jQuery UI Widgets Forums Editors MaskedInput background color in input text disabled

This topic contains 1 reply, has 2 voices, and was last updated by  Todor 3 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author

  • pepe
    Participant

    Good evening, the question is this. When I have a background color in the window and the text box disables it, I take the color of the window as the background color. I want to leave the text box disabled but with a white background. I do not know if the question is very simple but I have been trying to solve it for some time, but I do not give it with the solution.
    A greeting.

    <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
    “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
    <html lang=”en”>
    <head>
    <title>jQuery Window CSS Styling Sample</title>
    <link rel=”stylesheet” href=”../../jqwidgets/styles/jqx.base.css” type=”text/css”/>
    <link rel=”stylesheet” href=”../../jqwidgets/styles/jqx.summer.css” type=”text/css”/>
    <script type=”text/javascript” src=”../../scripts/jquery-1.11.1.min.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxcore.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxwindow.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxmaskedinput.js”></script>

    <script type=”text/javascript”>
    $(document).ready(function () {
    $(“#jqxwindow “).jqxWindow({
    height:200,
    width: 300,
    theme: ‘summer’
    });

    $(“#jqxmaskedinput”).jqxMaskedInput({
    width: ‘250px’,
    height: ’25px’,
    mask: ‘(###)###-####’,
    disabled: true
    });
    });
    </script>

    <style>
    input[type=”text”]:disabled {
    background-color: #FFF;
    }
    </style>

    </head>
    <body>
    <div id=’jqxwindow’>
    <div>Header</div>
    <div style=”background-color:#F6F”>
    <div ><input id=’jqxmaskedinput’ type=”text” ></div>
    </div>
    </div>
    </body>
    </html>


    Todor
    Participant

    Hello pepe,

    Add opacity to your css styles:

    input[type=”text”]:disabled {
      background-color: #fff;
      opacity: 1;
    }

    I think this should fix your issue.

    Let us know if you need further assistance.

    Best Regards,
    Todor

    jQWidgets Team
    https://www.jqwidgets.com

    • This reply was modified 3 months ago by  Todor.
    • This reply was modified 3 months ago by  Todor.
Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.