jquery center div at point

Question

I am creating a div using jquery and I am trying to center it at a specific point. The text in the div is dynamic, and it's not centered in a particular parent html, but rather I want to center it on just a specific point.

So basically I have

var centerX = 100; // dynamically computer in my code
$('<div/>').text('sometext').css({'left': (centerPointX - $('#mydiv').width() / 2) + 'px'});

But the width of mydiv is not known until it is rendered, so I'm not sure how to go about centering at the x point. Do I need an outer container in which to center in relative to?

Answer 1

Firstly $('#mydiv') only gets the element if it is available in the DOM .

So you would first be required to inject the element into the DOM and then access the width property . Otherwise it will be 0 when you try to access the width property of the element.