How Do I Know If The Mouse Pointer Is On The Html Element?

I have a timed event I want to behave differently accordingly to what HTML element the mouse pointer is on. Is there a way, assuming I have the HTML element, to know if the mouse p

Solution 1:

I'm not aware of any built-in way to ping an element for the status of mouse hovering.

However, you can create one by updating a flag at mouseenter and mouseleave -- which is where Brian Driscoll's suggestion of .hover comes in:

jQuery.fn.tracking = function () {
  this.data('hovering', false);

  this.hover(function () {
    $(this).data('hovering', true);
  }, function () {
    $(this).data('hovering', false);
  });

  returnthis;
};

jQuery.fn.hovering = function () {
  returnthis.data('hovering');
}

You'll need to initialize tracking for each element you care about:

$('#elem1,#elem2').tracking();

But then you can get the status of any of them:

if ($('#elem1').hovering()) {
    // ...
} elseif ($('#elem2').hovering()) {
    // ...
}

Demo: http://jsbin.com/amaxu3/edit

Solution 2:

Have you looked into jQuery.hover()? http://api.jquery.com/hover/

Solution 3:

You need to give name to html andme and on mouseover you need to check document.getelementsbyName. Then check what your are getting as output. Now you can take decision is it html control or asp.net.

When you use collObjects = object.getElementsByName("htmlcontrol") then compare id of both.

1 morething why you needed to check this in javascript. there may be some other solution for that. Just share with us.

Solution 4:

You might have some luck with document.elementFromPoint, although I believe there are some inconsistencies in older browser implementations (http://www.quirksmode.org/dom/w3c_cssom.html#documentview).

$('#elem').mousemove(function(e){
    if (this == document.elementFromPoint(e.clientX, e.clientY)) {
        // Do stuff
    }
});

Or outside of a handler

if ($('#elem').get(0) == document.elementFromPoint(x, y)) {
    // Do stuff
}

Aside from that, the only other option that comes to mind is using event handlers to keep track of which element the mouse is over.