先设置网页的大屏幕的宽高,以及点击事件：
1 <div style="width : 2000px,height : 2000px" onmousedown = "ww()">
<div id = "ex" style = "width :100px,height:30px "></div>
</div>
再设置它的样式：
1 *{ margin :0px; padding:0px; }
然后是js代码部分：
1 function $(oId){ 2 ????????????return document.getElementById(oId); 3 ????????} 4 ?????????5 ????????function ww(){ 6 ????????????var w= document.documentElement.clienWidth; 7 ????????????var h = document.documentElement.clienHeight; 8 ????????????var ww = window.pageXOffset; //pageXOffset 属性返回文档在窗口左上角水平滚动的像素 9 ????????????var hh = window.pageYOffset;10 ????????????// pageYOffset属性返回文档在窗口垂直方向滚动的像素11 ????????????var sw = w/2+ww;12 ????????????var sh = h/2+hh;13 ????????????rs(sw,sh); //调用14 ????????}15 ????????16 ????function rs(sw,sh){17 ????????$("ex").nextSibling.parentNode.removeChild( //先找到父节点再移除它18 ????????$("ex").nextSibling);//兄弟节点19 ????????var obj = document.createElement("div");20 ????????obj.style.width = "100px";21 ????????obj.style.height = "100px";22 ????????obj.style.position = "absolute";23 ????????obj.style.display = "block";24 ????????obj.style.top = sh+"px";25 ????????obj.style.left = sw+"px";26 ????????obj.style.backgroundColor = "red";27 ????????$("hehe").appendChild(obj);28 ????}29 ????[演示效果](http://localhost:63342/demo/work6.html)
网页中的宽与高
原文地址：https://www.cnblogs.com/dzlx/p/8120501.html