background color in input text disabled - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

Tagged: #maskedinput, background color, javascript maskedinput, jquery maskedinput, jqwidgets maskedinput, window

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

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

Author

background color in input text disabled Posts
April 14, 2019 at 8:56 pm background color in input text disabled #104747

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>

April 15, 2019 at 7:07 am background color in input text disabled #104751
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
Author

Posts

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

You must be logged in to reply to this topic.