I'm trying to open a div like a popup, but having it centered at the spot where the mouse was when it triggered the onclick event. In order to get the mouse position, I've been following this example
http://docs.jquery.com/Tutorials:Mouse_Position
jQuery(document).ready(function(){
$("#special").click(function(e){
$('#status2').html(e.pageX +', '+ e.pageY);
});
})
in that example, the click function is set client-side. However, in my scenario, I am going to set the onclick function server-side to many dynamically created objects. I will also be adding an argument to my function that will be unique to each object created.
The problem I'm facing is that I can't seem to get the eventargs ("e") when I set the onclick event NOT using JQuery.
Ultimately, a simplified example of what I'm trying to achieve would look something like this:
<div id="divSubscription" style="display: none; height: 0px; width: 0px; position: absolute;">some content</div>
<input type="button" id="btnOpenPopup" value="Open" onclick='openPopup(8, e)' />
function openPopup(subID, e) {
var x = e.pageX;
var y = e.pageY;
$("#divSubscription").css("top", y);
$("#divSubscription").css("left", x);
$("#divSubscription").css("display", "block");
$("#divSubscription").animate({ height: "400px", width: "400px" }, 300, "swing");
$("#divSubscriptionContent").html(subID);
}
Obviously, this doesn't work, because it has no idea what "e" is. Is there any way to accomplish what I'm trying to do?