I have a button and I want it to change to green when I access it by tab key. I have written the code for hover by mouse but I want that when a user a goes to the button using tab key then it should change the color.

I have a button and I want it to change to green when I access it by tab key. I have written the code for hover by mouse but I want that when a user a goes to the button using tab key then it should change the color.

• javascript
• jquery
• html
• css

• please post you have so far – X-Pippes Commented Aug 12, 2014 at 14:00
• What have you tried so far? and can you post some code for us to have a look at – Izzy Commented Aug 12, 2014 at 14:01
• I think you need something like focus event – Aliaksei Bulhak Commented Aug 12, 2014 at 14:01

1 Answer 1

Simply use the :focus pseudo selector

Demo Fiddle

button:focus{
    color:green;
}

More on :focus from MDN

The :focus CSS pseudo-class is applied when a element has received focus, either from the user selecting it with the use of a keyboard or by activating with the mouse (e.g. a form input).

You may also wish to give the button a tabindex attribute to control its tab order.