ishwr
ishwr

Reputation: 745

CSS: active status

It's just a simple question. I made a button using <a> with background image. It should use different image when it is clicked. I use :active property in its css. But the thing is even after the button is not pressed (release), the :active class is still there. So it is still using the image for the status. How come? And how I should do it, when I only want to apply the class when the button is pressed? Thank you. I hope I have explained it well enough.

Upvotes: 1

Views: 2154

Answers (2)

Sven
Sven

Reputation: 252

works fine for me: Demo

button {
    background-color: blue;
    border: none;
    color: #FFF;
}

button:hover {
    background-color: green
}

button:active {
    background-color: red
}

Can you provide a Demo to have a look in to it?

Upvotes: 1

Kyle Cureau
Kyle Cureau

Reputation: 19366

catwoman, if you just want it while pressed active should work. if you're looking for toggle, then you need what's below.

CSS doesn't have a selector that toggles, except for :checked on checked inputs.

You need Javascript:

<a href="#" onclick="toggle_class('foo');"

or to use jQuery Toggle: http://api.jquery.com/toggle/

--

then again, if you are actually looking for button pressed, active should work. paste your code here and we can check it out. if you're doing something that can't be performed solely with css :active pseudoclass, look at the mousedown event: http://api.jquery.com/mousedown/

Upvotes: 2

Related Questions