How to work with Click Event Handler jQuery

my JS Fiddle : https://jsfiddle.net/DTcHh/19134/

I Created this hover effect with css . i want the same effect on('click')with jQuery . When the user clicks on any one of the item . the clicked item will gets activated :

The Clicked item will be activated

and the other items will be deactivated :

enter image description here

javascript jquery css
sagar

Answers 1

Submit Answer
  • kishan patel

    In you onclick method, you could use jQuery css method for adding css just like that.

    $("item1").css({"background-color": "#000"});
$("item1").css({"background-image", "url('http://demo.musemaster.net/Clu/Clu-1/images/u579-r.png')"});

    You could also define class in css and after onclick, add the class to that specific item by using addClass method.

    $("item1").addClass('yourHoverClassName');

    CSS:

    .item1:hover .image1,.item1.yourHoverClassName .image1{
  background-image:url('http://demo.musemaster.net/Clu/Clu-1/images/u579-r.png');
  background-color:#000;
}

Related Articles