我编写了以下脚本,该脚本采用元素的子元素并使用 CSS 垂直对齐它们。该脚本在我测试过的所有主要浏览器中都运行良好,除了 IE。
由于我正在更改元素的位置值,因此我设置了容器对象的宽度和高度以及子对象的顶部和左侧,一旦脚本完成,它们将出现在同一个位置。IE 不能很好地处理 offsetTop/offsetLeft。
保持容器的大小:
element.style.width = element.offsetWidth + 'px';
element.style.height = element.offsetHeight + 'px';
保持孩子的姿势:
child.style.top = child.offsetTop + 'px';
child.style.left = child.offsetLeft + 'px';
孩子的对齐方式:
child.style.top = parent.offsetHeight / 2 - child.offsetHeight / 2 + 'px';
有任何想法吗?
算法的改进也将被欣然接受。