사이트 내 전체검색
[javascript] jQuery로 플래쉬효과나는 슬라이드 트리메뉴~
로빈아빠
https://cmd.kr/javascript/567 URL이 복사되었습니다.

본문

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=euc-kr">
  <meta name="generator" content="virhac.com">
  <title></title>
  <script type="text/javascript" src="jquery.min.js"></script>
  <script type="text/javascript">

    $(function(){
        $('li:has(ul)')
          .click(function(event){
            if (this == event.target) {
              if ($(this).children().is(':hidden')) {
                $(this)
                  .css('list-style-image','url(minus.gif)')
                  .children().slideDown();
              }
              else {
                $(this)
                  .css('list-style-image','url(plus.gif)')
                  .children().slideUp();
              }
            }
            return false;
          })
          .css({cursor:'pointer',
                'list-style-image':'url(plus.gif)'})
          .children().hide();
        $('li:not(:has(ul))').css({
          cursor: 'default',
          'list-style-image':'none'
        });
      });
 
 
  </script>
  <style>
   fieldset { width: 320px }
  </style>
  </head>
  <body>
  <fieldset>
  <legend>접을 수 있는 리스트 1</legend>
 
   <ul>
      <li class="globalNav">바이러핵
         <ul id="menu01_sub" class="localNav">
            <li><a href="#">회사연혁</a></li>
            <li><a href="#">개발일지쓰기</a></li>
            <li><a href="#">일지리스트보기</a></li>
             
                <li>관리
                    <ul>
                    <li><a href="#">도서 관리</a></li>
                    <li><a href="#">장비 관리</a></li>
                    <li><a href="#">차계부</a></li>
                    </ul>
                 </li>
            
            <li><a href="#">문서(이미지)올리기</a></li>
            <li><a href="#">문서(이미지)조회</a></li>
            <li><a href="#">이메일 보내기</a></li>
         </ul>
      </li>
      <li class="globalNav">프로그램팁
         <ul id="menu02_sub" class="localNav">
            <li><a href="#">프로그램개발팁 게시판</a></li>
            <li><a href="#">HTML 태그 샘플 만들기</a></li>
            <li><a href="#">소스 Finder 등록</a></li>
            <li><a href="#">숫자붙여서 소스만들기</a></li>
            <li><a href="#">테이블관련 소스 생성</a></li>
            <li><a href="#">소스ToHtml</a></li>
            <li><a href="#">문자열바꾸기</a></li>
            <li><a href="#">특정단어가 들어있는 라인뽑아내기</a></li>
            <li><a href="#">문자로 잘라내기</a></li>
            <li><a href="#">문자열치환</a></li>
            <li><a href="#">필드 Replace</a></li>
            <li><a href="#">RegEx로 문자열뽑아내기</a></li>
            <li><a href="#">테이블 CrtTbl</a></li>
            <li><a href="#">로칼PC응용프로그램</a></li>
            <li><a href="#">표준코드입력</a></li>
            <li><a href="#">표준코드조회</a></li>
         </ul>
      </li>
       <li class="globalNav">웹디팁
         <ul id="menu03_sub" class="localNav">
            <li><a href="#">색상표</a></li>
            <li><a href="#">글씨와 배경선택</a></li>
            <li><a href="#">한글특수문자표</a></li>
            <li><a href="#">HTML특수문자표</a></li>
            <li><a href="#">ASCII테이블</a></li>
            <li><a href="#">Oracle SQL</a></li>
            <li><a href="#">Ms SQL</a></li>
            <li><a href="#">자바스크립트와 PHP함수비교</a></li>
            <li><a href="#">메모</a></li>
         </ul>
      </li>   <li class="globalNav">유용한 사이트
         <ul id="menu04_sub" class="localNav">
            <li><a href="#">업무에 유용한사이트등록(주의: 아이사랑용)</a></li>
            <li><a href="#">프로그램 개발에 유용한사이트등록(주의: 프로그래머용)</a></li>
            <li><a href="#">프로그램 개발에 유용한사이트 리스트보기</a></li>
         </ul>
      </li>
      <li class="globalNav">사람 / 회사
         <ul id="menu05_sub" class="localNav">
            <li><a href="#">사람</a></li>
            <li><a href="#">회사</a></li>
           
         </ul>
      </li>
   
   </ul>

  </fieldset>
  </body>
</html>

댓글목록

등록된 댓글이 없습니다.

831 (7/17P)

Search

Copyright © Cmd 명령어 3.137.166.61