Carlos Frank
Carlos Frank

Reputation: 167

Adding hover effect when a keyboard is press

How do u add a hover like effect to a div when a specific key on the keyboard is press using jquery ?

  <div id="d-up" class="button"></div>

Thank you

Upvotes: 2

Views: 1335

Answers (1)

ketan
ketan

Reputation: 19351

You can do like following:

$(document).ready(function(){
    $(window).keypress(function(e){
       $(".button").css("background-color","#ccc");
    });
  
  $(window).keyup(function(e){
       $(".button").css("background-color","#fff");
    });
});
.button{
    width:50px;
    height:50px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="d-up" class="button"></div>

Check Fiddle

On Key press it will add background-color of div. (Press any key to view background-color)
Hope it helps.

Upvotes: 2

Related Questions