팝업 레이어 창은 항상 중앙에 위치합니다 코드 복사 코드는 다음과 같습니다. <br>var isIE=window.XMLHttpRequest?false:true; <br>var aIsIE={}; 🎜>if(isIE){ <br>window.onscroll=doIE; <br>window.onresize=doIE } <br>function doIE(){ <br>aIsIE.top=document.documentElement.scrollTop; aIsIE.left=document.documentElement .scrollLeft; <br>var width=document.documentElement.clientWidth; <br>var height=document.documentElement.clientHeight; <br>var oDiv=document.getElementById("oneReply"); 🎜>oDiv.style.top =aIsIE.top(height-oDiv.offsetHeight)/2 'px'; <br>oDiv.style.left=aIsIE.left(width-oDiv.offsetWidth)/2 'px'; ;/script> <br> <br> <br>우선 모든 사람이 호환되지 않는 CSS 스타일 위치를 이해해야 합니다. <br><br>Position 속성에는 정적, 절대, 고정, 상대. </div> <br> 학습 중에 어떤 레이아웃 상황에서 사용해야 하는지 함께 생각해 보세요. <br><br>position:static No positioning 이 속성 값은 모든 요소의 기본 위치 지정입니다. 일반적인 상황에서는 이를 구체적으로 선언할 필요가 없지만 때로는 상속 상황이 발생하여 이를 보고 싶지 않습니다. 요소에 의해 상속된 속성은 자체적으로 영향을 미치므로 position:static을 사용하여 상속을 취소할 수 있습니다. 즉, 요소 위치 지정의 기본값을 복원할 수 있습니다. 예: #nav { position:static; } 앞에서 언급한 다른 두 가지는 주로 고정 위치: 고정에 대해 설명합니다. 창의 고정 위치에 상대적인 위치 지정 속성 값은 무엇을 의미합니까? 요소는 절대값과 유사하게 위치하지만 포함 블록은 뷰포트 자체입니다. 웹 브라우저와 같은 화면 미디어에서는 문서가 스크롤될 때 요소가 브라우저 보기에서 이동하지 않습니다. 예를 들어 프레임 스타일 레이아웃을 허용합니다. 인쇄물과 같은 페이지 미디어에서는 고정된 요소가 첫 번째 페이지의 동일한 위치에 나타납니다. 이는 흐르는 제목이나 각주를 생성하는 데 사용할 수 있습니다. 비슷한 효과를 보았지만 대부분은 CSS를 통해서가 아니라 JS 스크립트를 사용하여 달성되었습니다. IE6은 지원하지 않는다는 점에 특히 주의하세요... <br><br>여기서는 이 문제를 해결하기 위해 "hack technology"와 "javascript"를 결합하여 사용합니다.<br><br> <br><br><br><img src="http://files.jb51.net/file_images/article/201311/201311291556081.gif?20131029155639" alt="Node.js 팝업 레이어는 항상 구현 아이디어와 code_javascript 기술 중심입니다." ><br>코드 복사<div class="codetitle"><span><a style="max-width:90%" data="45456" class="copybut" id="copybut45456" onclick="doCopy('code45456')"> 코드는 다음과 같습니다.<u><div class="codebody" id="code45456"> <br><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML1.0 Transitional//EN" "http://www.w3.org/1999/xhtml/TR/xhtml/DTD/xhtml1 -transitional.dtd"> <br>< html xmlns="http://www.w3.org/1999/xhtml"> <br>< 머리> <BR>< 메타 http-equiv="Content-Type" content="text/html; charset=utf-8" /> <br>< title>图胜前端工程师</title> <BR>< 스타일 유형="텍스트/css"> <br>body,div{margin:0; 패딩:0;} <br>#a{너비:200px;높이:200px;배경:파랑;위치:고정;왼쪽:50%;상단:50%;여백-왼쪽:-100px;여백-상단:-100px ;_위치:절대;} <br>< /스타일> <br>< 스크립트 유형="텍스트/자바스크립트"> <br>var isIE=window.XMLHttpRequest?false:true; <br>var aIsIE={}; <br>window.onload=function(){ <br>if(isIE){ <br>window.onscroll=doIE; <br>window.onresize=doIE; } <br>함수 doIE(){ <br>aIsIE.top=document.documentElement.scrollTop; <br>aIsIE.left=document.documentElement.scrollLeft; <br>var width=document.documentElement.clientWidth; <br>var height=document.documentElement.clientHeight; <br>var oDiv=document.getElementById("a"); <br>oDiv.style.top=aIsIE.top(height-oDiv.offsetHeight)/2 'px'; <br>oDiv.style.left=aIsIE.left(width-oDiv.offsetWidth)/2 'px';< /스크립트> <br>< /머리> <br>< 바디 스타일="너비:100%;"> <br>< div id="a"></div> <br>< br/><br/><br/><br/><br/><br/><br/><br/><br/ ><br/><br/><br/><br/><br/><br/><br/><br/> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <br>< /본문> <BR>< /html> <br> </div></u></a></span></div>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
