How to create both onClick and mouseover to a link jQuery

3.4k views Asked by At

I have this script to change main image on click to a link with .feature_thumb class. I want to make it so that it's both click and hover.

$(".feature_thumb").click(function(){

   var main_href = $(this).attr('href');

   change_image(main_href );

});

Can someone help me with this?

I tried this but it didn't work...

$(".feature_thumb").on('click hover') function(){

   var main_href = $(this).attr('href');

   change_image(main_href );

});

Thank you

2

There are 2 answers

0
A. Wolff On BEST ANSWER

hover() jQuery method is a shorthand for $( selector ).mouseenter( handlerIn ).mouseleave( handlerOut ); In fact you want mouseover:

$(".feature_thumb").on('click mouseover', function(){...});

Or depending exact expected behaviour and HTML markup, use mouseenter.

3
Brian H On

You're syntax is slightly off but it looks fine otherwise and should work.

Notice that in your code sample there are more closing parentheses than opening ones.

$(".feature_thumb").on('click hover', function(){

   var main_href = $(this).attr('href');

   change_image(main_href );

});

Also as other people have pointed out the hover event is actually two events. Hover is shorthand for $( selector ).on( "mouseenter mouseleave", handlerInOut );