adding class to element that the mouse is on

I need a function that will add a class to a element that the mouse is on now. this has to change when the mouse moves, eve开发者_开发百科ry were it goes that element should have the extra class.

I know how to get the x and y of a element using this

var mouseX = 0;
var mouseY = 0;
$().mousemove(function (e) {
    mouseX = e.pageX;
    mouseY = e.pageY;
});

but then how do i get the hole element in order to add the class?

Can any one here help me with this?

so any element the mouse hovers will get that class?

$('*').hover(function(){ $(this).addClass('theClass'); });

you can use-

1. mouseover

even you can use this code also- jquery has hust splitted hover in fallowing way-

$(".hoverme").live("mouseover mouseout", function(event) {
  if ( event.type == "mouseover" ) {
    // do something on mouseover
  } else {
    // do something on mouseout
  }
});

$('*').hover(function(){
    $(this).addClass('special'); // mouse over
},
function(){
    $(this).removeClass('special'); // mouse out
});

To know the element that triggered the event you can use the "target" property of the event and then get it's position using offset()

$('*').mousemove(function (e) {
    var target = e.target //this is the element that triggered the evnt
    //do what you want with target: to get it's position:
     var position = $(target).offset()

});

EDIT use '*' to select all elements or attach it to document $(document)

P.S. be prepared to handle A LOT of events, i don't know how this could impact on performance.

This is what i was looking for:

$('*').hover(
    function (event) {
        var elem = document.elementFromPoint(event.clientX, event.clientY);
        $(elem).addClass('khoverElem');
    },
    function (event) {
        $('.khoverElem').removeClass('khoverElem');

    }
);