st4rgut st4rgut - 1 year ago 83
Javascript Question

What is the purpose of .active along with .hover?

I am going through the w3 accordion example and ran into this confusing bit of css. The user clicks on the buttons to show the hidden text inside a sibling div. What I'm having trouble understanding is what purpose serves in the CSS code below. I know .active is used to indicate when certain elements like links are activated. Is it necessary in this case though because it works fine without that bit of code. Thanks for helping me learn.

Here's the link to the entire example and below is the css for the button, button.accordion:hover {
background-color: #ddd;

K48 K48
Answer Source

Otherwise the color of the element would be different when the user points the mouse at the element, and while the user holds down the mouse button.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download