mozilla
검색 결과

    Scroll Bars

     

    이제, 창에 스크롤바를 추가해 보도록 하겠습니다.

    스크롤바 추가하기

    스크롤바는 대개 사용자가 긴 문서를 이동하기 위해 사용됩니다. 또한 어떤 범위에 해당하는 값을 선택하기 위해서도 사용될 수 있습니다. 스크롤바는 여러 방식으로 생성될 수 있는데, XUL에서는 scrollbar 태그를 이용해서 만들어 집니다. 글상자와 같은 일부 요소는 내용이 너무 긴 경우와 같이, 필요에 따라 스크롤바를 추가할 수 있습니다.

    이 단원에서는 독립적인 스크롤바의 생성 방법에 대해 다룰 것입니다. 사용자는 스크롤바를 조정하여 값을 설정하게 될 것입니다. 여러분은 그리 많이 사용할 일이 없을 것입니다. 스크롤바는 주요 부분인 조정 가능한 스크롤상자(thumb)와 양 끝단에 있는 2개의 화살표 버튼들로 구성됩니다. 스크롤바는 이러한 모든 요소들을 자동으로 생성합니다.

    Image:scroll1.png

    스크롤바의 구문은 다음과 같습니다.

    <scrollbar
        id="identifier"
        orient="horizontal"
        curpos="20"
        maxpos="100"
        increment="1"
        pageincrement="10"/>
    

    속성은 다음과 같습니다.

    id
    스크롤바의 유일 식별자.
    orient
    이 속성은 스크롤바의 방향을 지정합니다. 기본값은 horizontal로, 좌측에서 우측으로 늘어나는 스크롤바를 만듭니다. vertical이라는 속성을 지정할 수도 있는데, 이는 상단에서 하단으로 늘어나는 스크롤바를 만듭니다.
    curpos
    이 속성은 스크롤상자(여러분이 스크롤바에서 앞뒤로 움직일 수 있는 막대)의 현재 위치를 나타냅니다. 이 속성값은 0부터 maxpos 속성에 지정한 값의 범위를 가집니다. 이 속성값은 단위를 필요로 하지 않으며, 기본값은 0입니다.
    maxpos
    이것은 스크롤상자의 최대 위치를 가리킵니다. 숫자로 나타내며 단위는 없습니다. 기본값은 100입니다.
    increment
    여기에 명시한 값은 사용자가 스크롤바에 있는 화살표 버튼을 클릭했을 때 curpos 값을 얼마나 변경할 지 지정합니다. 기본값은 1입니다.
    pageincrement
    여기에 명시한 값은 사용자가 스크롤바의 구간의 쪽를 클릭했을 때, 즉 스크롤상자와 화살표 사이의 영역을 클릭할 때 얼만큼의 curpos값이 변경될지를 지정합니다. 기본값은 10입니다.

    위에 있는 구문 예제는 0부터 100까지의 범위를 가지는 스크롤바를 생성할 것입니다. 100이라는 값은 목록에 있는 줄 수 일수 있지만, 여러분이 원하는 어떤 것일 수도 있습니다. 이 예제에서 초기값은 20입니다. 스크롤바의 화살표 중 하나를 클릭하면, 값은 위나 아래로 1씩 바뀌게 됩니다. 스크롤바의 페이지 영역(스크롤박스와 화살표 버튼 사이 영역)을 클릭하면 10만큼 바뀌게 됩니다.

    사용자가 스크롤바 화살표를 클릭하면 스크롤상자는 increment값에 지정한 양만큼 이동하게 됩니다. 이 속성값을 증가시키면 클릭할 때마다 더 멀리 이동하게 됩니다. 스크롤바의 좌측단 또는 최상단 위치는 0값을 가지며 우측단과 최하단 위치는 maxpos에 지정된 값을 가집니다.

    스크롤바의 값을 조정함으로써, 스크롤상자 부분을 원하는 곳에 위치시키고 화살표를 클릭했을 때 이동범위를 변경할 수 있습니다.

    다음에는 툴바를 만드는 방법에 대해 알아보겠습니다.

    문서 태그 및 공헌자

    태그: 
    Contributors to this page: teoli, Suguni
    최종 변경: teoli,