이 글의 예시에서는 오른쪽 하단에 고정된 확장 및 축소 가능한 DIV 레이어를 구현하는 JS 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 구현 방법은 다음과 같습니다. 코드 복사 코드는 다음과 같습니다. JS는 오른쪽 하단에 고정된 확장 및 축소 가능한 DIV 레이어를 구현합니다 <br> <!--<br /> *{마진:0;패딩:0;}<br /> 본문{텍스트 정렬:중심;}<br /> #main{border:red 1px solid;width:1000px;height:1600px;margin:0 auto;}<br /> #main #scroll{width:250px;height:150px;border:green 1px solid;text-align:left;position:absolute;visibility:hidden;}<br /> #main #scroll #open{float:left;text-align:center;width:180px;}<br /> #main #scroll #close{float:right;}<br /> //--><br> </스타일><br> </머리><br> <br> <div id="main"><br> 핵심적인 부분만 구현하세요. 내용은 직접 개선해도 좋고, 계속해서 아름답게 만들어도 좋아요! <br> <div id="scroll"><div id="open" onmouseover="openbox()"><a href="/" onclick="openbox()">환영합니다</a> ;< ;div id="close" class="zzsky"><marquee align="left" onmouseover="stop()" onmouseout="start()">귀중한 제안을 환영합니다! </div> <br> <div id="close"><a href="#" onclick="closebox()">닫기</a> <script type="text/javascript"><br> <!--<br /> var scroll=document.getElementById("scroll")<br /> var main=document.getElementById("main")<br /> var open=document.getElementById("open")<br /> var close=document.getElementById("close")<br /> scroll.style.visibility="visible"<br /> 함수 runright()<br /> {<br /> /*여기서 -4는 테두리를 설정했기 때문에 주로 더 나은 표시를 위한 것입니다*/<br /> scroll.style.top=document.body.scrollTop document.body.clientHeight-scroll.clientHeight-4 "px"<br /> scroll.style.left=document.body.scrollLeft document.body.clientWidth-scroll.clientWidth-4 "px"<br /> /*이 기능을 간격을 두고 실행하세요*/<br /> setTimeout("runright()",30)<br /> }<br /> /*닫기: 설정된 높이가 계속 감소합니다*/<br /> 함수 closebox()<br /> {<br /> scroll.style.height=scroll.offsetHeight-4 "px"<br /> If (scroll.offsetHeight>20)<br> {<br> setTimeout("closebox()",5)<br> }<br> 그 외<br> {<br> > 그러나 close.style.visibility="hidden"<br> }<br> }<br> 함수 openbox()<br> {<br> If (scroll.offsetHeight<148)<br /> {<br /> ~ ~ ‐ ( scroll.style.height=scroll.offsetHeight 2 "px"<br /> setTimeout("openbox()",5)<br /> }<br /> }<br /> runright();<br /> //--><br> <br> </div><br> </div><br> </div><br> </본문><br>
