div scroll 생기게 하기

[JSP] div scroll 생기게 하기

스타일로 줄수도 있고 div에 직접 줄수도 있다.

<style type="text/css">

    .pop-layer {

        width: 550px;

  height: 200px;

        margin: 10px auto;

        display: none;

        position: absolute;

        top: 200px;

        left: 350px;

        background-color: #fff;

        border: 2px solid #D8D8D8;

        z-index: 10;

        overflow-y: auto;  

    }

</style>

<div id="pop-layer">

스크롤 테스트 

<br>

<br>

<br>

<br>

<br>

<br>

<br>

<br>

</div>

※ 스타일시트의 OverFlow 속성

 

1) overFlow : visible

레이어 속의 내용이 레이어의 크기를 넘을 경우, 레이어 크기를 키워서 보여준다. (default 설정 값)

2) overFlow : hidden

레이어 속의 내용이 레이어의 크기를 넘을 경우, 레이어 크기만큼만 보여준다.

3) overFlow : auto

레이어 속의 내용이 레이어의 크기를 넘을 경우, 내용에 따라 자동으로 스크롤을 만든다.

4) overFlow : scroll

레이어 속의 내용의 길이와 상관없이 무조건 스크롤을 만든다.

 

* X, Y에 대해 다르게 적용하고자 할 때에는

overFlow-x : scroll, overFlow-y : scroll

와 같이 적용한다.