评论：CSS、JS 使DIV水平 和 垂直居中的各种方法  [查看原文]

可惜不能实时刷新

沐枫自然1
2017/8/15 23:37:42

@ macyoyo 实现 实时刷新，可以用js 去监听浏览器窗口大小被改变时，重新定位即可，由于上面的代码是之前我发出的代码不能编辑，现在我把实现 实时刷新（更新定位）的代码如下：

注：将以下js代码直接替换上面Js栏中的代码即可：

window.onload = function() {
	var oMain = document.querySelector('#pop-main');
	(function(doc, win) {
		var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
			recalc = function() {
				console.log('窗口大小被改变啦。。。');
				oMain.style.left = (document.documentElement.clientWidth - oMain.offsetWidth) / 2 + 'px';
				oMain.style.top = (document.documentElement.clientHeight - oMain.offsetHeight) / 2 + 'px';
			};
		if(!doc.addEventListener) {
			return false;
		}
		win.addEventListener(resizeEvt, recalc, false);
		doc.addEventListener('DOMContentLoaded', recalc, false);
	})(document, window);
};