主页 / 问题 / 1484563
Accepted
gorden
Asked:2023-01-08 19:21:25 +0000 UTC2023-01-08 19:21:25 +0000 UTC

如何确保一个div位于另一个div的中心

  • 772

我有一个 div，其中另一个 div 可以移动、调整大小和旋转。我怎样才能做到这一点，当这个 div 位于中心时，它会通过警告通知我它恰好位于另一个 div 的宽度或高度的中心。

javascript

1 个回答

  1. Best Answer

    选项1

    let centeredDiv = document.querySelector('#centered-div');
let parentDiv = document.querySelector('#parent-div');

let centeredDivWidth = centeredDiv.offsetWidth;
let centeredDivHeight = centeredDiv.offsetHeight;
let parentDivWidth = parentDiv.offsetWidth;
let parentDivHeight = parentDiv.offsetHeight;

if ((centeredDivWidth + centeredDiv.offsetLeft) == (parentDivWidth / 2) 
 && (centeredDivHeight + centeredDiv.offsetTop) == (parentDivHeight / 2)) {
 console.log('Div центрирован');
 
} else {
 console.log('Div не центрирован');
}

    选项 2

    let centeredDiv = document.querySelector('#centered-div');
let parentDiv = document.querySelector('#parent-div');

let centeredDivWidth = centeredDiv.offsetWidth;
let centeredDivHeight = centeredDiv.offsetHeight;
let parentDivWidth = parentDiv.offsetWidth;
let parentDivHeight = parentDiv.offsetHeight;

if ((parentDivWidth / 2)  - (centeredDivWidth / 2) == centeredDiv.offsetLeft
 && (parentDivHeight / 2) - (centeredDivHeight / 2) == centeredDiv.offsetTop) {
 console.log('Div центрирован');
 
} else {
 console.log('Div не центрирован');
}
    • 1

相关问题