Within this function, I am passing a parameter called pos which contains the x and y position values. My intention is to use these values to determine where the output of the div tag should be placed. However, for some reason, it doesn't seem to be working as expected. Can anyone identify what mistake I might be making?
The main goal of this function is to show the HTML content within the div at the location of your mouse hover...
Currently, the content that appears on hover is being displayed at the bottom of the webpage instead.
Thank you, Chris
featureOver: function(ev,latlng,pos,data)
{
var X = pos.x;
var Y = pos.y;
alert('X = ' + X + ' ' + 'Y = ' + Y);
document.body.style.cursor = "pointer";
$("div#over").css("top", Y + "px");
$("div#over").css("left", X + "px");
$("div#over").html(data.name);
},
HTML CODE
<table id=maptable border=2>
<th>
<div id="map_canvas" style="height:500px; width:700px; background-color:white; border:1px solid black; "></div>
<div id="over"></div>
</th>