Changing button color programmatically
Is there a way to change the color of a button, or at least the co开发者_开发问答lor of the button label programmatically? I can change the label itself with
document.getElementById("button").object.textElement.innerText = "newlabel";
But how to change the color?
I have finally found a working code - try this:
document.getElementById("button").style.background='#000000';
Here is an example using HTML:
<input type="button" value="click me" onclick="this.style.color='#000000';
this.style.backgroundColor = '#ffffff'" />
And here is an example using JavaScript:
document.getElementById("button").bgcolor="#Insert Color Here";
Probably best to change the className:
document.getElementById("button").className = 'button_color';
Then you add a buton style to the CSS where you can set the background color and anything else.
use jquery : $("#id").css("background","red");
If you assign it to a class it should work:
<script>
function changeClass(){
document.getElementById('myButton').className = 'formatForButton';
}
</script>
<style>
.formatForButton {
background-color:pink;
}
</style>
<body>
<input id='myButton' type=button class=none value='Change Color to pink' onclick='changeClass()'>
</body>
I believe you want bgcolor. Something like this:
document.getElementById("button").bgcolor="#ffffff";
Here are a couple of demos that might help:
Background Color
Background Color Changer
Try this code You may want something like this
<button class="normal" id="myButton"
value="Hover" onmouseover="mouseOver()"
onmouseout="mouseOut()">Some text</button>
Then on your .js file enter this.Make sure your html is connected to your .js
var tag=document.getElementById("myButton");
function mouseOver() {
tag.style.background="yellow";
};
function mouseOut() {
tag.style.background="white";
};
加载中,请稍侯......
精彩评论