일반 탭메뉴 > 그누보드5 스킨

그누보드5 스킨

좋은 댓글과 좋아요는 제작자에게 큰힘이 됩니다.

일반 탭메뉴 정보

최신글 일반 탭메뉴

첨부파일

tabmenu.zip (2.0K) 543회 다운로드 2015-04-21 15:50:18

본문

스킨이라 하기는 좀 그렇고 일반적인 탭 메뉴입니다.
개인적으로 맘에 들어서 올립니다.

파일 다운로드->압축 해제->각각 그누5의  js 및 css폴더에 업로드 하시고,
head.sub.php에서 적당한 위치에 아래와 같이 불러 오십시오.

<!-- 탭 메뉴 {-->
<script src="<?php echo G5_JS_URL ?>/ddtabmenu.js"></script>
<link rel="stylesheet" href="<?php echo G5_CSS_URL?>/ddtabmenu.css">
<!-- 탭메뉴 }-->

다음 적용할 해당 페이지에 아래 스크립트를 줍니다.
<script type="text/javascript">
<!--
ddtabmenu.definemenu("ddtabs_gallery", 0) 
                ddtabmenu.definemenu("탭 메뉴 아이디", 0)
                ddtabmenu.definemenu("탭 메뉴 아이디", 0)
                // 여기서 0는 처음으로 보여줄 탭을 지정합니다. 0는 첫 탭, 1는 두번째 이렇게 시작합니다. 탭 메뉴를 여러개를 사용 시에는, 아래 소스에서 지정한 해당  아이디명을 입력하면 무제한으로 사용 할 수 있습니다.
//-->
</script>

그리고 탭메뉴를 넣을 위치에 아래 소스를 삽입해서 사용하면 됩니다.

<div id="ddtabs_gallery" class="basictab_gallery">
<ul>
<li><a href="링크 입력" rel="gallery1" title=""><span>탭 1</span></a></li>
<li><a href="링크 입력" rel="gallery2" title=""><span>탭2</span></a></li>
<li><a href="링크 입력" rel="gallery3" title=""><span>탭 3</span></a></li>
<li class="last"><a href="링크 입력" rel="gallery4" title=""><span>탭 4</span></a></li>
</ul>
</div>
<div class="tabcontainer_gallery">
<div id="gallery1" class="tabcontent_gallery">탭 1 내용</div>
<div id="gallery2" class="tabcontent_gallery">탭2 내용</div>
<div id="gallery3" class="tabcontent_gallery">탭3 내용</div>
<div id="gallery4" class="tabcontent_gallery">탭4 내용</div>
</div>

좋은 점이라면,
1. 탭에 각각 링크를 넣어서 해당 메뉴로 이동할 수 있습니다.
2. 아이디와 클래스 명을 교체하면 동일 페이지 내에서 무제한으로 사용할 수 있습니다.
3. 마우스 오버에서 마우스를 떼면 자동으로 위에서 지정한 탭으로 돌아갑니다.

디자인은 스타일 파일에서 수정을 하시면 됩니다.

*초보라서 질문은 받지 않습니다.

추천
11

댓글 전체

전체 2,431 |RSS
그누보드5 스킨 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT