11.Nas_1


새창 작성 수정 목록 링크 Edit G카랜다 HDD HDD HDD 게시물 주소 복사


[ jQuery / Menu / Navigation ] jQuery, CSS로 된 메뉴바

♨ 카랜더 일정 :
  • 링크

  • 첨부

  • 컨텐츠 정보

    본문

    \r\n
    \r\n
    \r\n

    [ jQuery / Menu / Navigation ] jQuery, CSS로 된 메뉴바

    \r\n\r\n
    \r\n
    \r\n
    \r\n

    Gruve :: [ jQuery / Menu / Navigation ] jQuery, CSS로 된 메뉴바

    \r\n
    \r\n
    \r\n
    \r\n
    \r\n
    gruve.tistory.com/3 - 저장된 페이지
    \r\n
    공개적으로 +1했습니다. 실행취소
    \r\n

    [ jQuery / Menu / Navigation ] jQuery, CSS로 된 메뉴바 · Web/Script, jQuery 2012/ 07/24 21:18. [ jQuery / Menu / Navigation ] jQuery, CSS로 된 메뉴바. 심플하고 ...
     

    \r\n

     

    \r\n\r\n
    \r\n
    \r\n

      * {About the Author}
      * {Documentation}
      * {Download}
    HorizontalNav

    \r\n\r\n
    \r\n
    \r\n

    HorizontalNav is a jQuery plugin that spans a horizontal navigation to fit the full width of it's container. If you've ever had to create this effect on a project, you'll know it's pretty annoying to do. But this plugin makes it easy and adds support for IE7.

    \r\n\r\n
    \r\n
    \r\n

    Example One

    \r\n\r\n
    \r\n
    \r\n

    This is an example so you can see the difference between a horizontal navigation with no fixed widths and then with a navigation that has the plugin applied to it. There are no requirements to how you style the navigation and adding padding, margins or borders to any of the elements won't break the effect.
      * {Demo}
      * {JavaScript}
      * {HTML}
      * {CSS}
    Navigation with horizontalNav disabled
      * {Navigation Item}
      * {Work}
      * {Blog}
      * {About}
      * {Contact}

    \r\n\r\n
    \r\n
    \r\n

    Navigation with horizontalNav enabled
      * {Navigation Item}
      * {Work}
      * {Blog}
      * {About}
      * {Contact}
    // When document is ready...
    $(document).ready(function() {
     // Call horizontalNav on the navigations wrapping element
     $('.full-width').horizontalNav({});
    });
    <nav class="horizontal-nav full-width">
     <ul>
      <li><a href="#">Navigation Item</a></li>
      <li><a href="#">Work</a></li>
      <li><a href="#">Blog</a></li>
      <li><a href="#">About</a></li>
      <li><a href="#">Contact</a></li>
     </ul>
    </nav>
    // There is no required CSS for this plugin to work properly
    // but here is what is being used to style this demo
    .horizontal-nav {
     background: #efefef;
     border-radius: 6px;
    }
    .horizontal-nav ul {
     background: #128F9A;
     float: left;
     text-align: center;
     border-radius: 6px;
     border: 1px solid #0e7079;
    }
    .horizontal-nav ul li {
     float: left;
     border-left: 1px solid #0e7079;
    }
    .horizontal-nav ul li:first-child {
     border-left: 0 none;
    }
    .horizontal-nav ul li a {
     display: block;
     padding: 10px 20px;
     color: #fff;
     border-top: 1px solid rgba(255,255,255, 0.25);
     border-left: 1px solid rgba(255,255,255, 0.25);
    }
    .horizontal-nav ul li:first-child a {
     border-left: 0 none;
    }
    .horizontal-nav ul li a:hover {
     background: #12808a;
    }
    .horizontal-nav ul li:first-child a {
     border-top-left-radius: 6px;
     border-bottom-left-radius: 6px;
    }
    .horizontal-nav ul li:last-child a {
     border-top-right-radius: 6px;
     border-bottom-right-radius: 6px;
    }
    Available Options
    Key   Default value   Description   
    responsive   true   This option will allow the navigation to auto adjust when the window is resized. 
    responsiveDelay   100   The amount of time to wait before re-adjusting the navigation on window resize. Value is set in milliseconds. 
    tableDisplay   true   Enables modern browsers to use display: table or set to false to manually calculate the widths of list items.  

    \r\n\r\n
    \r\n
    \r\n

    HorizontalNav is built and maintained by {Sebastian Nitu} and is licensed under a {Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License}. Follow me on {Twitter}, {GitHub} and {Dribbble}.

    \r\n\r\n
    \r\n
    \r\n

    {[Creative Commons License]} 

    \n
    [이 게시물은 관리자님에 의해 2013-11-18 21:29:50 11.H_BBS에서 이동 됨]
    [ 추가 정보 ... 더보기) ]
    뷰PDF 1,2



    office view text|top|||||||||||||

    관련자료

    댓글목록

    등록된 댓글이 없습니다.

    목록

    새창 작성 수정 목록 링크 Edit G카랜다 HDD HDD HDD 게시물 주소 복사




    Total 1,674 / 1 Page
    [ ● 작업준비)Synology에서 기본인증서는 유료,기타 활용 멀티인증서 사용 ]

    ● 작업준비)Synology에서 기본인증서는 유료,기타 활용 멀티인증서 사용https://svrforum.com/nas/372241letsenc…

    [ ● syncthing 으로 사진관리 자동백업 설정 재설정 재연결 작업 synology NAS간편 스마트폰 사… ]

    ● syncthing 으로 사진관리 자동백업 설정 재설정 재연결 작업 synology NAS간편 스마트폰 사진 백업- 가장빨리 백업및 pc에서 …

    [ fat HDD 형식 ntfs 형식으로 변환하기 ]

    FAT hdd현식은 4gIGA 이하로 COPY 가능핮니가\r\n4GIGS 이상 5GIGA이상 카피 불가능한 파일 NTSC로 HDD형…

    [ 시놀로지 네트워크 백업하기(한 대의 공유기에 NAS 2 ... ]

    ◎ 네이버에서 [https://11q.kr 홈피] 검색 찾아오세요 ◎http://ojos.tistory.com/84\n[이 게시물은 관리자님에 …

    [ linkhard/설치형 개인 간단 웹하드 ] 댓글 3

    ♥\r\n내컴퓨터를 세상에 링크하기. 설치형 웹하드 솔루션 no.1! 링크하드\r\n\r\n\r\n\r\n링크하드 게시판\r\n\r\n링크하드소…

    [ 모바일로 접속시 URL 이동시키기 ]

    \r\n\r\n\r\n\r\n\r\n \r\n\r\n\r\n\r\n\r\n\r\n\r\n 글쓴이 : o하하o \r\n 조회 : 3,773 추천 …

    [ 배추빌더 개인 홈페이지 메인 화면 최신글 및 베너수정 ]

    배추빌더 홈페이지 개인 메인 최신글 수정\r\n은 자기가 사용하는 스킨에서 수정한다w:\mwb\skin\mw.builder\mw.basic.3\…

    [ 배추빌더 하단 메뉴 아이콘 수정 ]

    2012-09-05 22:30:10 , 154 조회\r\n\r\nwritten by 11q.kr관리자\r\n\r\n배추빌더 하단 메뉴 아이콘 수…

    [ 그룹별 게시판 <사이트맵> 만들기 ]

    본문\r\n\r\n오랫만입니다. 예전 g3에서 쓰던 것을 약간 변형하였습니다. 그누보드의 그룹과 게시판의 이름들로 사이트맵을 자동으로 만들어주는…

    [ 가로 메뉴(자동/수동) ]

    \r\n1) 게시판 그룹별 가로 메뉴입니다. 게시판 그룹 단위로 생성된 게시판을 자동으로 불러오게 됩니다. 현재 사용자가 임의로 추가할 수 있는…

    [ AcroEdit 정식 파일을 내려 받을 수 있는 게시판입니다. ]

    AcroEdit 정식 파일을 내려 받을 수 있는 게시판입니다.AcroEdit를 처음 설치하시거나 모든 파일을 새로 설치하시려면 설치버전을 다운 …

    [ 동영상 iframe ]

    # 에이치H 2013.06.06 13:02:18 211.♡.189.97 작성자에 의해 채택됐습니다.굳이 허용 하시려면 lib/common.lib…

    [ editplus파일 비교 WinMerge 2.14.0 - latest stable version 및 모든 설… ] 댓글 5

    ###■ https://11q.kr는 정보를 찾아 공유 합니다..■ http:/\r\n홍길동 487B4-A1148 주민번호 입니다\r\n\r\n…


    ♥간단_메모글♥


    최근글


    새댓글



    PHP 안에 HTML ☞ 홈페이지 화면갱신 시간은 ♨
    ▶ 2024-06-16 13:17:40

    오늘의 홈 현황


    • 현재 접속자♨ 507 명
    • 오늘 가입자※ 0 명
    • 어제 가입자※ 3 명
    • 주간 가입자※ 24 명
    • 오늘 방문자 1,467 명
    • 어제 방문자 1,320 명
    • 최대 방문자 13,042 명
    • 전체 방문자 4,381,254 명
    • 전체 게시물※ 8,636 개
    • 전체 댓글수※ 24,741 개
    • 전체 회원수 11,051 명

    QR코드


    ☞ QR코드 스캔은 kakao앱 자체 QR코드

    알림 0








    최신글↑