2013-01-03 3 views
1

기본 편의 지식이있는 모바일 사이트를 만들기 위해 hammer.js를 사용하고 있습니다. 나는 상위 메뉴를 음수 상위 위치에 숨겨 두 번 탭하면 css3 전환을 사용하여 나타납니다. 그러나 나는 두 번째 두 번 누를 때 다시 숨길 바란다.최상위 위치 설정 및 설정

if/else을 사용하여 최상위 위치를 호출하고 그에 따라 다시 설정하려고했지만 작동하지 않습니다. 아무도 내가 잘못 가고있는 것을 알고 있습니까?

var t = $("#topbar"); 
var position = t.position(); 

$sw.on('doubletap', function(event) { 
    event.preventDefault(); 
    if (position.top == '-55px') { 
     $('#topbar').css("top", "0"); 
    } 
    else { 
     $('#topbar').css("top", "-55px") 
    } 
}); 

사이트 주소는 http://www.bettondesignwork.co.uk/tim/mobile

감사

입니다
+1

나는 뭔가를 놓치고 있거나'position = t.position()'해야합니다. b e 이벤트 처리기에 있고 외부에 있지 않습니까? – hayavuk

답변

2

이 작업을 시도 할 수 있습니다 :

var t = $("#topbar"); 
var position = t.offset(); 

$sw.on('doubletap', function(event) { 
    event.preventDefault(); 
    if (position.top == '-55px') { 
     $("#topbar").offset({ top: "0"}); 
    } 
    else { 
     $('#topbar').offset({ top: "-55px"}); 
    } 
}​ 
+0

이 모든 것이 내 첫 번째 문제를 해결하지 못해서 고맙습니다. 그러나 일단 메뉴가 나타나면 두 번째로 두 번 탭하면 다시 숨기지 않습니다. –

+0

@TimWilkinson @ sawe의 대답을 확인하십시오. 또한 이벤트 내에'console.log (position.top);'를 넣어서 주어진 시간에 값이 무엇인지 (그리고 어떻게 나타나는지) 확인할 수 있습니다. 물론 데스크톱에서이를 테스트하기 위해 클릭 이벤트로 변경하고 싶을 수도 있습니다. – Joonas

+0

@TimWilkinson 이와 비슷한 것 http://jsfiddle.net/lollero/YTpAm/2 – Joonas

2

문제는이 라인

if (position.top == '-55px') 

내가 해요 경우를 수 잘못하지 않은 찍은 .top 속성은 그래서 u는

if (position.top == -55) 

에 코드를 변경 또는 방어 적

if (position.top < 0) 
0

는 HTMLElement

function getHTMLElementTop(thisNode, Top) 
    { 
      if (Top == undefined) 
      { 
       var Top = 0; 
      } 
      if (thisNode.nodeType == 1) 
      { 
       Top += thisNode.offsetTop; 
       //if (thisNode.parentNode) 
       if (thisNode.offsetParent) 
       { 
        Top = getHTMLElementTop(thisNode.offsetParent, Top); 
       } 
      } 
      return Top; 
    } 

월의 최고 위치를 가져옵니다 될 수있는 숫자입니다 도움이 될 것입니다