将鼠标输入img标签时创建div

Question

I want to create a div with left and top when the mouse cursor is above a img tag, I tried some things but doesn't work. Here's my code:

$(document).on('mouseenter', 'img', function(){
     var vid = this.id;
     if(vid == "marcker"){
       $("<div/> ",{
          id: "test",
          text:"tese",
          left: mousex+"px",//this part doesn't work
          top: mousey+"px",//this part doesn't work
          heigth:"40px", //this part doesn't work
          width: "40px", //this part doesn't work
          style:"background-color:red;height:50px;",
          class: "classA"
        }).appendTo("body");
      }
});

Answer 1

1. You misspelled the word "heigHT"
2. The width attribute isn't supported anymore so you have to use CSS.
3. What are the mousex and mousey objects?

Answer 2

i resolved my problem

\\function that take mouse position when the mouse point is above the tag img

 $(document).on('mouseenter', 'img', function(){
                if(this.id == "marcker"){
                var x = event.pageX;
                var y = event.pageY;
                create_new_div(x,y);

             }
      });

function that create a new div with mouse position

function create_new_div(mousex,mousey){
               div = document.createElement("div");
               div.style.position = "absolute";
               div.style.left = mousex + 'px';
               div.style.top =  mousey + 'px'; 
               div.style.width = "30px";
               div.style.height = "30px";
               div.style.background = "red";
               div.style.color = "blue";

               document.body.appendChild(div);
           }

thanks alot for help