在jQuery中将div定位到按钮的右下角

Question

I can set a div to top and left position of a button using following code:

var p = $("#tag-add");
var offset = p.offset();
$("#TagModal").offset({ top: offset.top, left: offset.left})  

Output:

But I want to set the div to bottom right of button:

How to do this?

Answer 1

Use this:

$("#TagModal").offset({
  top: offset.top + p.outerHeight(),
  right: offset.left + p.outerWidth()
});

Answer 2

Try with this:

var p = $("#tag-add");
var offset = p.offset();

var $modal = $("#TagModal");
$modal.offset({
  top: offset.top + p.outerHeight(),
  left: offset.left + p.outerWidth() - $modal.outerWidth()
});

(Subtract width of the modal from @PraveenKumar's example)

See this JSFiddle.