mouseover an element

Question

How come I can't do this?

if($('.element').mouseover() == true)
{
}
else
{
}

I want to know when the mosue is over a element if isn't do something else.

Here is the full code that now works. I got rid of the if statement...

$('.product_image').hover(function(){
  var image = $(this).attr('class');
  image = '.' + image.substring(14);
  $(image).fadeIn();
});
$('.product_disc').mouseleave(function(){
  $('.product_disc').fadeOut();
});

let us know what you want to do , there are already lot of methoods availble for mouseover , there is no need to check if it mouseover or not// one more thing post your html if something is not working — kobe, Dec 07 '10 at 22:54

score 2 · Accepted Answer · edited May 23 '17 at 12:18

2

I use this pattern a lot:

$('.element').mouseenter(function() {
    $(this).addClass('hover');
}).mouseleave(function(){
    $(this).removeClass('hover');
});

Now you can use the is method to see if the mouse is over the element.

There is a reason to use mouseenter vs mouseout - it has to do with nested elements. You can see that here

edited May 23 '17 at 12:18

Community

1
1

answered Dec 07 '10 at 23:00

partkyle

1,458
1
15
25

I guess mouseleave() act different that mouseout(). I used that and all my problems went away. Thanks. – JamesTBennett Dec 07 '10 at 23:03

score 0 · Answer 2 · answered Dec 07 '10 at 22:47

0

$(".element").mouseenter(function() {

    alert('Mouse over the element');

}).mouseleave(function() {

    alert('Mouse out');

});

answered Dec 07 '10 at 22:47

user534312

91
2
7

score 0 · Answer 3 · answered Dec 07 '10 at 22:50

0

one more latest one..which is elagent to use

$(".element").hover(
  function () {
   //this is mouseover
  }, 
  function () {
   //this is mouseout
  }
);

answered Dec 07 '10 at 22:50

kobe

15,671
15
64
91

score 0 · Answer 4 · answered Dec 07 '10 at 22:51

The syntax that jQuery uses is different that what would normally write. Their tag line used to be something like "it will change the way you write JavaScript code". You have to use mouseover() like this:

$('.element').mouseover(function() {
    // Use $(this) to access the element where the mouse is entering.
}).mouseout(function() {
    // Use $(this) to access the element where the mouse is exiting.
});

Also note the similar mouseenter() and mouseleave() methods. Se the official documentation here: http://api.jquery.com/mouseover/.

score 0 · Answer 5 · answered Dec 07 '10 at 22:56

0

Here is a working example:

http://www.jsfiddle.net/mSkx5/1/

This uses the hover function of jQuery.

Good luck!

EDIT: here is a working example with mouseover

http://www.jsfiddle.net/mSkx5/2/

answered Dec 07 '10 at 22:56

Trufa

39,971
43
126
190

mouseover an element

5 Answers5