Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to position a DIV in a specific coordinates?

I want to position a DIV in a specific coordinates ? How can I do that using Javascript ?

like image 431
Adham Avatar asked Oct 20 '22 06:10

Adham


People also ask

How do I change the position of a div in HTML?

position: relative; Setting the top, right, bottom, and left properties of a relatively-positioned element will cause it to be adjusted away from its normal position. Other content will not be adjusted to fit into any gap left by the element.

How do you find XY coordinates of a div?

If the element is in the main document you can get the DIV's coordinates with... var X=window. getComputedStyle(abc,null). getPropertyValue('left'); var Y=window.

How do you put a div in the right corner?

To place a div in bottom right corner of browser or iframe, we can use position:fixed along with right and bottom property value assigned to 0.


1 Answers

Script its left and top properties as the number of pixels from the left edge and top edge respectively. It must have position: absolute;

var d = document.getElementById('yourDivId');
d.style.position = "absolute";
d.style.left = x_pos+'px';
d.style.top = y_pos+'px';

Or do it as a function so you can attach it to an event like onmousedown

function placeDiv(x_pos, y_pos) {
  var d = document.getElementById('yourDivId');
  d.style.position = "absolute";
  d.style.left = x_pos+'px';
  d.style.top = y_pos+'px';
}
like image 223
Michael Berkowski Avatar answered Oct 21 '22 20:10

Michael Berkowski