불여우에서도 되는 메뉴 6

까만도둑

프로필 보기 이 회원 글보기 이 회원의 댓글보기

· 20년 전 · 조회 3735 3735 · 댓글 4 4

Sample Script

첫번째 탭 메뉴의 내용에 들어갈 구문을 입력 하세요

두번째 탭 메뉴의 내용에 들어갈 구문을 입력 하세요

세번째 탭 메뉴의 내용에 들어갈 구문을 입력 하세요

네번째 탭 메뉴의 내용에 들어갈 구문을 입력 하세요

<html>
<head>
<title>Sample Script </title>

#tablist li{
list-style: none;
display: inline;
margin: 0;
}

#tablist li a{
padding: 3px 0.5em;
margin-left: 3px;
border: 1px solid #778;
border-bottom: none;
background: white;
}

#tablist li a:link, #tablist li a:visited{
color: navy;
}

#tablist li a.current{
background: lightyellow;
}

/**내용이 보여질 박스 설정**/
#tabcontentcontainer{
width: 400px;
padding: 20px;
border: 1px solid black;
}

.tabcontent{
display:none;
}

</style>

var initialtab=[1, "sc1"] // 처음 시작될 탭의 ID

function cascadedstyle(el, cssproperty, csspropertyNS){
if (el.currentStyle)
return el.currentStyle[cssproperty]
else if (window.getComputedStyle){
var elstyle=window.getComputedStyle(el, "")
return elstyle.getPropertyValue(csspropertyNS)
}
}

var previoustab=""

function expandcontent(cid, aobject){
if (document.getElementById){
highlighttab(aobject)
detectSourceindex(aobject)
if (previoustab!="")
document.getElementById(previoustab).style.display="none"
document.getElementById(cid).style.display="block"
previoustab=cid
if (aobject.blur)
aobject.blur()
return false
}
else
return true
}

function highlighttab(aobject){
if (typeof tabobjlinks=="undefined")
collecttablinks()
for (i=0; i<tabobjlinks.length; i++)
tabobjlinks[i].style.backgroundColor=initTabcolor
var themecolor=aobject.getAttribute("theme")? aobject.getAttribute("theme") : initTabpostcolor
aobject.style.backgroundColor=document.getElementById("tabcontentcontainer").style.backgroundColor=themecolor
}

function collecttablinks(){
var tabobj=document.getElementById("tablist")
tabobjlinks=tabobj.getElementsByTagName("A")
}

function detectSourceindex(aobject){
for (i=0; i<tabobjlinks.length; i++){
if (aobject==tabobjlinks[i]){
tabsourceindex=i 
break
}
}
}

function do_onload(){
var cookiecheck=window.get_cookie && get_cookie(window.location.pathname).indexOf("|")!=-1
collecttablinks()
initTabcolor=cascadedstyle(tabobjlinks[1], "backgroundColor", "background-color")
initTabpostcolor=cascadedstyle(tabobjlinks[0], "backgroundColor", "background-color")
if (typeof enablepersistence!="undefined" && enablepersistence && cookiecheck){
var cookieparse=get_cookie(window.location.pathname).split("|")
var whichtab=cookieparse[0]
var tabcontentid=cookieparse[1]
expandcontent(tabcontentid, tabobjlinks[whichtab])
}
else
expandcontent(initialtab[1], tabobjlinks[initialtab[0]-1])
}

if (window.addEventListener)
window.addEventListener("load", do_onload, false)
else if (window.attachEvent)
window.attachEvent("onload", do_onload)
else if (document.getElementById)
window.onload=do_onload

</script>

var enablepersistence=true // 현재페이지 유지시에는 true, 아니면 false

function savetabstate(){
document.cookie=window.location.pathname+"="+tabsourceindex+"|"+previoustab
}

window.onunload=savetabstate

</script>

</head>

<body>

<ul id="tablist">
<li><a href="#" class="current" onClick="return expandcontent('sc1', this)">첫번째메뉴</a></li>
<li><a href="#" onClick="return expandcontent('sc2', this)" theme="#EAEAFF">두번째메뉴</a></li>
<li><a href="#" onClick="return expandcontent('sc3', this)" theme="#FFE6E6">세번째메뉴</a></li>
<li><a href="#" onClick="return expandcontent('sc4', this)" theme="#DFFFDF">네번째메뉴</a></li>
</ul>

</DIV>
</body>
</html>

[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 4개

몰라

프로필 보기 이 회원 글보기 이 회원의 댓글보기

20년 전

와 감사드립니다. 이거 찐짜 많이 사용하는 거잖아요...^^

고냉이

프로필 보기 이 회원 글보기 이 회원의 댓글보기

20년 전

이거 괜찮네요.

혜심

프로필 보기 이 회원 글보기 이 회원의 댓글보기

20년 전

훌륭합니다.감사합니다.

아드리안

프로필 보기 이 회원 글보기 이 회원의 댓글보기

18년 전

게시글 목록

번호	제목	글쓴이	조회	날짜
10823	JavaScript 퀵메뉴 1	senseme	1,225	12년 전
10821	기타 HTTP 에러 코드표 1	senseme	3,205	12년 전
10818	JavaScript 입력박스안에 왠 아이콘? 2	senseme	828	12년 전
10816	JavaScript 게시판 글작성시 일부 태그막기 1	senseme	1,752	12년 전
10813	jQuery 랜덤한 레이아웃과 효과 2	카츠	3,603	12년 전
10810	JavaScript 자동으로 textarea 크기 조절하기 2	senseme	5,234	12년 전
10808	JavaScript textarea 자동 늘려주기 2 1	senseme	1,406	12년 전
10806	JavaScript 해당 브라우저에 지원하는 이벤트 확인 1	senseme	737	12년 전
10805	JavaScript 자바스크립트로 논리적인 XOR 연산하기.	senseme	2,712	12년 전
10804	JavaScript 동적 셀렉트박스 다루기.	senseme	2,463	12년 전
10802	JavaScript 자바스크립트 이벤트 핸들러 (Event Handler) 1	senseme	1,487	12년 전
10801	JavaScript 함수명을 변수로 해야할 때	senseme	2,900	12년 전
10800	JavaScript 이메일 유효성 정규식 - 자바스크립트	senseme	6,504	12년 전
10798	PHP 카페24 절약형으로 관리자페이지 제작가능 할까요? 1	누메40	2,132	12년 전
10795	PHP simple_html_dom parser 예제 2	네오soft	1,870	12년 전
10794	웹서버 내 서버에 사이트를 마음대로 늘리기!!	랄랄라0	764	12년 전
10791	PHP 무료 알림 서비스 설치형 유메시지(게시판,쇼핑몰,은행,병원,학교,교회등등등 활용도 높음) 2	불량학생	1,770	12년 전
10790	PHP 네이버 api 왜 접속 불가라고 나올가요?? ㅠㅠ	sa2pan	1,244	12년 전
10780	Mobile 국산브라우저 피모가 정식판으로 판올림 되었습니다. 9	주재넷	3,881	12년 전
17665	서식 영수증 양식 3	개발새발	9,817	12년 전
10779	PHP 실제로 존재하는 URL인지 확인하기	개발새발	1,127	12년 전
20132	기타 modern.ie 일종의 ie 테스터? 2	전진	2,424	12년 전
10775	JavaScript 이미지 슬라이드 관련입니다.(자바,제이쿼리) 3	생각보다몸이앞서다	2,120	12년 전
20126	CSS 웹표준코딩에 필요한 지식 참고하세요. 5	접신	2,936	12년 전
10771	JavaScript 롤오버시 서브메뉴가 나타나는 기본 스크립트 3	kiplayer	5,969	12년 전

이전 다음

39 40 41 42 43

전체 목록