메뉴 건너뛰기

조회 수 8566 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
<script>


   $(function() {


       var tab = $.getUrlVar('tab');


       //alert(tab);


       $( "#tabs" ).tabs();


       $( "#tabs" ).tabs( "option", "active", tab );


   });





   $.extend({


        getUrlVars: function(){


            var vars = [], hash;


            var hashes = 


window.location.href.slice(window.location.href.indexOf('?') +1).split('&');


 


            for(var i = 0; i < hashes.length; i++) {


                hash = hashes[i].split('=');


                vars.push(hash[0]);


                vars[hash[0]] = hash[1];


            }


            return vars;


        },


        getUrlVar: function(name) {


            return $.getUrlVars()[name];


        }


    });


</script>


 


<body>


    <div id="menu">


        <ul>


            <li><a href="./webpage.html?tab=0"></a></li>


            <li><a href="./webpage.html?tab=1"></a></li>


            <li><a href="./webpage.html?tab=2"></a></li>


        </ul>


    </div>


 


    <div id="tabs">


        <ul>


            <li><a href="#tabs-1"></a></li>


            <li><a href="#tabs-2"></a></li>


            <li><a href="#tabs-3"></a></li>


        </ul>


        <div id="tabs-1"></div>


        <div id="tabs-2"></div>


        <div id="tabs-3"></div>


    </div>


</body>

$.extend 로 시작하는 쿼리문을 추가한 뒤

get방식으로 넘긴 파라미터를 $.getUrfVer("파라미터명")으로 받아 올 수 있음

 

링크 클릭시 get방식으로 탭 인덱스를 넘기고 

$("#tabs").tabs("option", "active", 탭 인덱스)

식의 쿼리 문을 넣어주면 페이지 이동시 해당 탭메뉴로 포커스가 이동함


  1. jquery 디데이 계산 (D-day,Dday)

  2. No Image 27Mar
    by
    2017/03/27 Views 8704 

    jquery를 활용한 입력폼 초기화하기

  3. No Image 21Sep
    by 조쉬
    2016/09/21 Views 8566 

    Get방식 파라미터 전송 & 탭 메뉴 선택

  4. No Image 17Nov
    by
    2016/11/17 Views 8547 

    jQuery tr 추가 (입력창 추가), jQuery 테이블 행 추가/삭제, selector last name

  5. hover 메소드를 이용해서 메뉴 on, off를 구현

  6. No Image 21Sep
    by
    2016/09/21 Views 8379 

    getJSON() 함수

  7. No Image 22Dec
    by
    2016/12/22 Views 8361 

    흐르는 배너 만들기2

  8. No Image 09Sep
    by
    2016/09/09 Views 8149 

    jquery selector / jquery 선택자 / 자주 사용하는 jquery selector 선택자 / selecter

  9. Html 색상표 모음, 색상코드표 (RGB), 이미지X, 복사 가능

  10. No Image 09Sep
    by
    2016/09/09 Views 8046 

    ajax 아작스 통신

  11. jQuery 카테고리 선택에 따른 하위 카테고리 변경 (selecbox)

  12. No Image 11Mar
    by
    2017/03/11 Views 7791 

    Ajax 파일 업로드 샘플 코드

  13. No Image 09Sep
    by
    2016/09/09 Views 7734 

    강제 click 이벤트 발생

  14. No Image 22Dec
    by
    2016/12/22 Views 7732 

    하단 고정 레이어 스타일(CSS) 따라하기

  15. No Image 21Sep
    by
    2016/09/21 Views 7530 

    키보드 이벤트가 발생한 객체의 id값 알아내기

  16. No Image 02Mar
    by
    2017/03/02 Views 7513 

    검토하기: jQuery를 이용하여 form 처리하기

  17. Table을 DIV로 표현하기 (예제)

  18. No Image 11Sep
    by
    2016/09/11 Views 7360 

    jquery 이용한 이미지 변환

  19. No Image 21Sep
    by
    2016/09/21 Views 7346 

    FORM 객체 초기화 하기

  20. 예제로 만나보는 제이쿼리 - 비동기 파일업로드

Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved