[jQuery] location of pop-up ajax response
Hi All,
I am building a site with a bunch of forms which i retrieve via ajax.
I am trying to do something similar to what google does with maps
where when the user clicks on a specific point, the form displays
relative to the users position, AND most importantly the position
relative to the rest of the screen, so that the returned form does not
cause the user to scroll.
For instance, if the user clicks close to the left of the screen, then
the form will show up to the right. But if they click close to the
right of the screen, then the form would show up to the left.
I currently am just taking the users click location and then appending
some css, but I am hoping their is a nice way to do this. such as
finding the % left and saying 'if % left > 50 then x, else..."
Below is what I have so far, but I'm pretty sure I'm not on track with
this. Any ideas would be great.
[code]
$(".add").click(function(event) {
var posTop = event.pageY;
var posLeft = event.pageX;
var formID = "#addForm";
var id=this.id;
$(formID).css({ position: 'absolute', top: posTop, left: posLeft });
$(formID).fadeIn("slow").html(loading);
$.ajax({
url: "add.php",
data: "cid="+cid,
success: function(response){
$(formID).html(response);
$('.date-pick').datePicker({clickInput:true});
cancelForm(formID);
}
});
});
[/code]