javascript - hovered - mouseover vs mouseenter

How can I find current element on mouseover using jquery (6)

How can I get the class name of the current element that is on mouseover. For example

When mouse is over from div to a, I want to get class name of div element.How can I get it using jquery?


$(document).on('mouseover', 'div,a,span', function() {

All depending on how you want it. This could also be an option:

»Fiddle 1«

With some more detail. This will only show as true after taking the direct path from a to div. (The tiny white space between a and div.) As in:

  • a -> div TRUE
  • a -> div -> white space in between -> div FALSE

»Fiddle 2«

Might hold up. This will also show as true if one go to the tiny white space between a and div, and then go back to div. As in:

  • a -> div -> white space in between -> div TRUE

var mode = 0;
$(window).on("mousemove", function(e) {
    if ( === "d1") {
        mode = 1;   
    } else {
        var cc =;
        if (cc !== "d2" && mode) {
            var el = $(".d1"),
                d1 = {
                    x : el.offset().left,
                    y : el.offset().top,
                    w : el.width(),
                    h : el.height()
                c = {
                    x  : e.pageX,
                    y  : e.pageY
            if (c.x >= d1.x + d1.w && c.y >= d1.y && c.y <= d1.y + d1.h)
                mode = 2;
                mode = 0;
        } else if (cc === "d2" && mode) {
            mode = 3;
    $("#status").html("Current: " + (mode == 3 ? "OVER" : "NOT OVER") + " from a" );

From jQuery API

 <div class="className">
      <span class="span">move your mouse</span>

<script src=""></script>
    <script type="text/javascript">
    $(".className").mouseover(function() {
        var n = $(this).attr("class");
        $(".span").html("The class :"+n);

Get the position of element on mouseover and then get the class name

<div id="wrapper">
<a href="#" class="anchorClass">A</a><div class="divClass">DIV</div>

$('#wrapper').mouseover(function(e) {
    var x = e.clientX, y = e.clientY,
        elementOnMouseOver = document.elementFromPoint(x, y);


If you don't want to apply this only on wrapper div but on whole window/document, then you can replace wrapper with window/document


What most people have neglected is this request from the OP:

When mouse over div from a

Meaning you need to know you've hovered from a specific type of element, not just from any element.

I made a global var, changing to true on the mouseleave of specific elements, in your case an a element. Then, inside the hover function you need to check that it's true.

Here's a Demo

Edit: Updated fiddle demo with edge cases when hovering from a element not directly onto the div.

this should work:

define a class in your style sheet:

    border: white solid 1px;

    border: red solid 1px;

then in your js:

$('div.detectable-div:hover').mouseover(function () {
    $(this) // this is your object