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

谢谢

4

3 回答 3

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"});
    }
}​
于 2013-01-03T12:04:09.467 回答
2

问题可能是这条线

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

如果我没记错的话， .top 属性是数字，所以你可以将代码更改为

if (position.top == -55)

或者变得更具防御性

if (position.top < 0)
于 2013-01-03T12:05:32.900 回答
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;
    }

可能有帮助

于 2017-02-14T16:59:38.383 回答