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,689 / 42 Page
    [ 림스모바일에 최신글 new.php 추가 하기 ]

    bbs/new.php\r\nskin/new/basic/new.skin.php\r\n폴더에 넣고\r\nbbs/new.php를 링크추가 사용하세요\…

    [ index.php에서 최신글 불러오기 게시판list 연결문의 ] 댓글 1

    모바일 > 질문/답변 > index.php에서 최신글 불러오기 게시판list 연결문의\r\n목록 수정 삭제 글쓰기 스크랩\r\n글쓴이\r\n심봉…

    [ 배너 관리 프로그램 ]

    배너 관리 프로그램\r\n\r\n\r\n맞을꺼야\r\n작성일시2013.02.13 11:17:52\r\n조회710\r\n댓글39첨부파일\r\nma…

    [ 패스 지정 해주고자 할때 111 PATH=$PATH:/11 ]

    본문\r\n\r\n/usr/local/mysql/bin을 패스 지정 해주고자 할때.. export PATH=$PATH:/usr/local/mys…

    [ 아미나 모바일 amna mobile 글 수정 무조건 가능하게 하기 ]

    \r\n-----파일 1수정-----------\r\n//m/skin/view.skin.amina.php #8 아래 //처리 수정으로 모바일 수…

    [ 아미나 모바일 새로달린 뎃글 html 형식으로 나오는 것 수정 ]

    아미나 모바일 새로달린 댓글 html 형식으로 나오는 최신글 문의\r\n\r\n안녕하세요\r\n\r\n어미나의 도움으로 잘사용하는 사용자 입니다…

    [ 림스모바일 상.하단메뉴 추가 작업926 ]

    .\r\n.\r\nShims HomePage\r\n[https://11q.kr 홈피] \r\n.\n\n[이 게시물은 관리자님에 의해 2013-0…

    [ webftp ] 댓글 1

    .\r\nhttp://www.techmixer.com/build-web-ftp-client-services-with-phpwebftp/\r\n-…

    [ 한글깨짐_자동로그인시처음 한글깨짐1230 ]

    common.php에 문자셋을 추가 해결아마 그누보드 문자셋 초기 설치후 정의하여 사용하면 이상 없음자동로그인 은 아래 링크 참조https://…

    [ 구글애드센스가 필요없으면 html폴더내 title-board.php파일 삭제 ]

    1. 구글애드센스가 필요없으면 html폴더내 title-board.php파일의<div class="main-google-ad">구글 …

    [ foscam_8918 wipcamera manual 메뉴얼 및 설치 사용기 ] 댓글 3

    ip camera를 115000원에 구입 설치기 및 설치 cd입니다 \r\nhttps://11q.kr/shim/bbs/board.php?bo_t…

    [ phpMyAdmin 최신버전으로 업데이트 하기 버전 정보: 4.0.9 (최신버전) ]

    phpMyAdmin 최신버전으로 업데이트 하기 버전 정보: 4.0.9 (최신버전)http://sourceforge.net/###■ https:/…

    [ 시놀로지 diskstation folder 의미 정의 폴더 만들기 개인 홈폴더 정리내용 ]

    시놀로지 diskstation folder 의미 정의 폴더 만들기 개인 홈폴더 정리내용\r\n11q.kr 는 네이버/구글에서 검색 찾아오세요--…

    [ 림스 2.6.3과 아미나 모바일 스킨 레이아웃 2.0.9 설치 기록 ] 댓글 1

    1.아미나 림스스킨/레이아웃을 다운 압축을 m폴더에 복사\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\…

    [ 최종20130505)림스2.5.3모바일 아미나209/220모바일 오리지널 설치후 수정 작업 20130406 … ] 댓글 17

    \r\n============= 완벽한 모바일 홈피 홈페이지를 위하여 ================\r\n1.글쓰기 에러\r\n2.글삭제 에러\…

    [ ip webcam으로 카메라서버 만들어 원격 ]

    ###\r\n스트리밍서버와 안드로이드폰(스마트폰) 연동하여 웹캠으로 원격감시\r\n안드로이드 개발 | 2012.07.10 01:32 목록 크게\…

    [ 문자열 찾기 및 대체하기 ]

    \r\n문자열 찾기 및 대체하기\r\n\r\nPosted on 2013년 3월 22일 by 훼니\r\n\r\n\r\n\r\n문자열 찾기\r\n\…


    ♥간단_메모글♥


    최근글


    새댓글



    PHP 안에 HTML ☞ 홈페이지 화면갱신 시간은 ♨
    ▶ 2025-07-09 18:27:16

    오늘의 홈 현황


    • 현재 접속자♨ 469 명
    • 오늘 가입자※ 1 명
    • 어제 가입자※ 1 명
    • 주간 가입자※ 7 명
    • 오늘 방문자 56,821 명
    • 어제 방문자 75,758 명
    • 최대 방문자 122,350 명
    • 전체 방문자 6,575,581 명
    • 전체 게시물※ 9,029 개
    • 전체 댓글수※ 25,722 개
    • 전체 회원수 11,732 명

    QR코드


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

    알림 0








    최신글↑