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

Question

我只是想将一个 div 向左移动 40%，然后通过单击/切换返回到 0%...不知道为什么它不起作用我在它起作用之前已经完成了。出于某种原因，这会隐藏 NAV 按钮并且不会切换....

Fiddle

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