html - How to change color of button in active state using inline CSS? -
is there way change background color and/or border color of button when in active state (i.e. clicked) using inline css?
<button class="btn btn-xs btn-primary btn-inverse dropdown-toggle" type="button" data-toggle="dropdown" style="margin-top: 12px; background-color: rgba(0, 0, 0, 0); border-color:rgba(0, 0, 0, 0); margin-right:20px">
something when button clicked?
considering css :active
css pseudo-class , not dom property or attribute
can't have inline equivalent that.
but, if in case, click event valid alternative, can that...
<script> function togglebg(element, color) { if(!color) { color = element.dataset.normalcolor; } else { element.dataset.normalcolor = element.style.backgroundcolor; } element.style.backgroundcolor = color; } </script> <button onmousedown="togglebg(this,'red')" onmouseup="togglebg(this)">red on press</button>
just note, inline-styling or inline-javascript isn't practice, if can, use css:
<style> button:active { background: red; } </style> <button>red when active</button>
Comments
Post a Comment