Effects by clicking a button

Asked

Viewed 6,460 times

3

I’d like to know how I can add an effect by clicking a button, I’m using HTML5 and CSS.

I add an effect with :HOVER, that as soon as the mouse is positioned on button the background of it is changed, but would like an effect that to the click on on the button the color change effect is activated.

Thank you!

  • 3

    Take a look at the properties :active and :visited http://www.w3schools.com/cssref/tryit.asp?filename=trycss_sel_link_more1

1 answer

1

in which case you will need to use Javascript. Try applying the following code.

<style>
    button{
        border: 0;
        padding: 35px 50px;
        font-weight: bolder;
        color: #fff;
    }
</style>
<script>

function mudaCor(el){
    el.style.backgroundColor = '#'+Math.floor(Math.random()*16777215).toString(16);
}

</script>


<button onclick="mudaCor(this)">Clique</button>

In case the Javascript function is taking a random color, if you want a standard color just change the hexadecimal code. See in the example below

el.style.backgroundColor = '#069';

Browser other questions tagged

You are not signed in. Login or sign up in order to post.