jquery - 不使用 hide() 和 show() 显示/隐藏

<分区>

想改进这个问题吗？ 通过 editing this post 添加细节并澄清问题.

关闭 9 年前。

我现在有这个。我想在不使用功能的情况下实现隐藏/显示的功能。是否可以使用

visibility:hidden

? Kindly provide me a DEMO

HTML

<div id="btn-toggle-menu">Hide Menu</div>
<div id="menu-wrapper">
    <ul>
        <li>link item</li>
        <li>link item</li>
        <li>link item</li>
        <li>link item</li>
        <li>link item</li>
        <li>link item</li>
    </ul>
</div>

JavaScript

$(document).ready(function() {
    $('#btn-toggle-menu').click(function() {
        var hidden = $('#menu-wrapper').data('hidden');
        $('#btn-toggle-menu').text(hidden ? 'Hide Menu' : 'Show Menu');
        if(hidden)
        {
            $('#menu-wrapper').animate({left: '20px' },500)
        } 
        else {
            $('#menu-wrapper').animate({
                left: '-210px'
            },500)
        }
        $('#menu-wrapper').data("hidden", !hidden);
    });
});

最佳答案

我想你可能正在寻找 CSS 属性