ex:让一个div始终显示在屏幕中间
一、
css:#idName{position: absolute;z-index: 999; ?px;margin-top: ?px;}//此处的初始定位按具体的自己调
计算并设置页面滚动条改变时移动的距离:
function sc1(idName) {
var d = document.getElementById(idName);
d.style.top = (document.documentElement.scrollTop + (document.documentElement.clientHeight - d.offsetHeight) / 2) 【此处加上或减去上移或者下移的高度】+ "px";
d.style.left = (document.documentElement.scrollLeft + (document.documentElement.clientWidth - d.offsetWidth) / 2) + "px";
}
function scall() {
sc1("idName");
}
window.onscroll = scall;
window.onresize = scall;
window.onload = scall;
若是和diaplay一起使用 在显示后再调用
window.onscroll = scall;
window.onresize = scall;
二、纯css实现始终显示在屏幕中间
ex:
#div_window {
400px; /**宽度**/
height: 300px; /**高度**/
position: fixed; /**定位采用此种方式**/
left: 50%; /**左边50%**/
top: 50%; /**顶部50%**/
margin-top: -100px; /**上移-50%**/
margin-left: -150px; /**左移-50%**/
display: none;
border: 1px black solid;
background-color: #DCDCDC;
}
样式和宽高自己定,根据宽高调整margin-top,margin-left 将它调到页面中间即可。滚动时便会根据位置显示在屏幕中间。