위키백과:둘러보기 틀: 두 판 사이의 차이

내용 삭제됨 내용 추가됨
Klutzy (토론 | 기여)
Klutzy (토론 | 기여)
일단 기존 내용 싹 날림
1번째 줄:
{{도움말}}
 
'''둘러보기 틀'''은 문서의 맨 끝에 위치하여, 그 문서가 속한 주제의 다른 문서들을 정리하여 보여주는 역할을 합니다.
'''NavFrame 클래스'''(NavFrame class)와 그것을 활용하는 동적 [[:분류:둘러보기 틀|둘러보기 틀]]에 대한 도움말 문서입니다.
 
== 둘러보기 틀 만들기 ==
NavFrame보다 표에 들어가는 Collapsible을 사용하는 쪽을 권장합니다. 참고로, 2007년 9월을 기점으로 영어 위키백과에서는 [[:en:Wikipedia:Collapsible tables]]를 사용하기 시작하였습니다.
한국어판에서도 Claapsible table을 사용할 수 있습니다. 예제로는 [[틀:스포일러 숨김]]을 참고해주세요.
 
== 기술적 사항 ==
동적 둘러보기 틀(Dynamic navigation boxes)은 [[CSS]]와 [[자바스크립트]]를 이용해서 내용을 "숨겼다가 보였다가"할 수 있는 둘러보기 틀을 말합니다. 기술적인 측면에서 보면, 동적 둘러보기 틀은 [[MediaWiki:Common.css]]의 스타일시트 정의와 [[MediaWiki:Common.js]]의 자바스크립트 정의로 구성됩니다.
 
둘러보기 틀은 자바스크립트를 지원하는사용하며, 현대의 거의 모든 웹 브라우저는브라우저에는 제대로문제가 보여줍니다없습니다. 즉, IE. 5/6/7, [[파이어폭스]], [[사파리 (웹 브라우저)|사파리]] / KHTML, [[오페라 (웹 브라우저)|오페라]] 8/9, 등등의 브라우저(단, [[인터넷 익스플로러]]는 5.5 버전 이상)은 제대로 엘리먼트 안의 내용을 "숨겼다가 보였다가"해 줄 것입니다.
예제는 다음과 같습니다. ([숨기기], [보이기] 버튼을 누르십시오.)
 
{{NavFrame도움말삽입/예제1}}
 
== 사용 방법 ==
=== NavFrame div===
태그 <tt>div</tt>를 사용하면 보이는 거의 모든 것들을 숨길 수 있습니다. 세 개의 주요클래스(class)가 준비되어 있습니다: <tt>'''NavFrame''', '''NavHead''', '''NavContent'''</tt>. 초기 상태는 안의 내용이 숨겨진 상태이며, 오른쪽 위에 "보이기" 버튼 링크가 보이는 상태입니다. <!--예외적으로 NavContent에 <tt>style="display:none;"</tt>가 들어가 있으면, 초기 상태는 안의 내용이 숨겨진 상태가 됩니다.-->
 
====간단한 예제====
세 개의 <code>div</code> 엘레멘트를 사용하십시오.
{|
|+
<pre><div class="NavFrame">
<div class="NavHead">[... 제목입니다. ...]</div>
<div class="NavContent">
[... 내용입니다. ...]
</div>
</div></pre>
|}
 
<div class="NavFrame">
<div class="NavHead">[... 제목입니다. ...]</div>
<div class="NavContent">
[... 내용입니다. ...]
</div>
</div>
 
 
 
<!--
최초 상태가 내용을 숨긴 상태가 되게 하려면 다음과 같이 하십시오:
<source lang="html4strict"><div class="NavFrame">
<div class="NavHead">[... 제목입니다....]</div>
<div class="NavContent" style="display:none;">
[... 내용입니다. ...]
</div>
</div></source>
<div class="NavFrame">
<div class="NavHead">[... 제목입니다....]</div>
<div class="NavContent" style="display:none;">
[...내용입니다....]
</div>
</div>
-->
 
==== 타 클래스(class) 사용례 ====
다른 클래스(class)들에도 NavFrame을 적용할 수 있습니다. 일반적인 클래스(class)를 사용했을 때보다 스타일리쉬한 디자인이 가능해집니다:
<source lang="html4strict"><div class="messagebox standard-talk NavFrame">
<div class="somerandomclass NavHead">
[... 제목입니다; 문자열만이 아니라 다른 것이 될 수도 있습니다....]</div>
<div class="NavContent anotherclass">
[... 숨기고 싶은 내용입니다. ...]
</div>
</div></source>
<div class="messagebox standard-talk NavFrame">
<div class="somerandomclass NavHead">
[... 제목입니다; 문자열만이 아니라 다른 것이 될 수도 있습니다. ...]</div>
<div class="NavContent anotherclass">
[... 숨기고 싶은 내용입니다....]
</div>
</div>
 
 
<!--
== Limitations ==
Currently, the three <code>Nav*</code> classes apply styles of their own. When mixing classes, this causes some of the Nav styles to override other styles (in the above example, NavFrame is overriding the styles from <code>.messagebox.standard-talk</code>).
 
This limitation does not affect collapsible tables.
-->
 
== 접근성 ==
자바스크립트를 지원하는 거의 모든 웹 브라우저는 제대로 보여줍니다. 즉, IE. 5/6/7, [[파이어폭스]], [[사파리 (웹 브라우저)|사파리]] / KHTML, [[오페라 (웹 브라우저)|오페라]] 8/9, 등등의 브라우저(단, [[인터넷 익스플로러]]는 5.5 버전 이상)은 제대로 엘리먼트 안의 내용을 "숨겼다가 보였다가"해 줄 것입니다.
 
[[인터넷 익스플로러]] 5 버전과 JavaScript를 지원하지 않는 다른 브라우저들은 [숨기기/보이기] 링크를 보여주지 않을 것이며, 엘리먼트 안의 내용을 그대로 표시해 줄 것입니다.
 
== 같이 보기 ==
* [[:MediaWiki:Common.css]]
* [[:MediaWiki:Common.js]]
 
<!-- categories -->
[[분류:둘러보기 틀|*]]
 
[[en:Wikipedia:NavFrameNavigation templates]]
<!-- interwiki -->
 
[[en:Wikipedia:NavFrame]]
[[ja:Help:ダイナミック・ナビゲーション・ボックス]]
[[ru:Википедия:Сворачивающиеся блоки]]
[[simple:Wikipedia:NavFrame]]
[[zh-yue:Wikipedia:NavFrame]]