Question

我只是试图将div向左移动40％，然后在点击/切换时返回0％...不确定为什么它不起作用我已经在它工作之前完成了它。出于某种原因，这隐藏了NAV按钮并且没有切换....

的jQuery

$("#mobileNav").toggle(function() {
    $("#content").animate({ "left" : "40%" }, 500);
}, function() {
    $("#content").animate({ "left" : "0%" }, 500);
});

HTML

<div class="header">
    <a href="#" id="mobileNav">Nav</a>
</div>

<div id="mainContain">
    <div id="menu"></div>
    <div id="content"></div>
</div>

Answer 1

该版本的切换已被弃用和删除，现在它只隐藏和显示内容，但您可以创建自己的切换功能：

$("#mobileNav").on('click', function() {
    var toggle = $(this).data('toggle'),
        dist   = toggle ? '0%' : '40%';

    $("#content").animate({ "left" : dist }, 500);
    $(this).data('toggle', !toggle);
});

FIDDLE

Answer 2

看起来没有任何东西触发您的动画调用。试试这个

var toggle = false;
$("#mobileNav").click(function(){
    toggle = !toggle;
    if(toggle)
         //do animations
    else
        //reverse the animations
});

jQuery在点击时切换不工作/隐藏导航

2 个答案: