jQuery-slideToggle保持打开状态直到关闭 [英] jQuery - slideToggle keep open until closed

问题描述

我正在为我的成员的userOptions创建一个AF滑动面板.可以很好地与

I'm creating af slide panel for the userOptions for my members. It's working nicely with:

//Login panel, slideUp when clicked <-> slideDown
$('#loginPanel').click(function(){
    $('#userNav').slideToggle('fast');
});

但是，当您刷新页面或转到网站上的其他页面时，我希望面板保持打开状态.如果用户关闭面板，则必须保持关闭状态，直到再次打开等.

But I would like the panel to stay open when you refresh the page or go to another page on the website. If the user close the panel it has to stay closed, untill opened again etc.

这可能吗?

*添加至答案*

对于瞬间的滑动"，我只是将速度加了1:

For the instant "slide" i just added 1 to the speed:

$('#div').slideToggle(1);

，与$ .cookie中的其他内容相同.

and same for the other ones in the $.cookie.

推荐答案

尝试使用 $ .cookie() 插件可设置和记住面板的当前状态，并在页面刷新/更改时相应地加载它.

Try using the $.cookie() plugin to set and remember the current state of the panel and load it accordingly on page refresh / change.

$(document).ready(function()
{
    // Open / Close Panel According to Cookie //    
    if ($.cookie('panel') == 'open'){    
        $('#userNav').slideDown('fast'); // Show on Page Load / Refresh with Animation
        $('#userNav').show(); // Show on Page Load / Refresh without Animation
    } else {
        $('#userNav').slideUp('fast'); // Hide on Page Load / Refresh with Animation
        $('#userNav').hide(); // Hide on Page Load / Refresh without Animation
    }

    // Toggle Panel and Set Cookie //
    $('#loginPanel').click(function(){        
        $('#userNav').slideToggle('fast', function(){
            if ($(this).is(':hidden')) {
                $.cookie('panel', 'closed');
            } else {
                $.cookie('panel', 'open');
            }
        });
    });
}

这是用来说明的小提琴: http://jsfiddle.net/7m7uK/

Here's fiddle to illustrate: http://jsfiddle.net/7m7uK/

您可以使用小提琴并刷新页面以查看cookie的工作.

You can use the fiddle and refresh the page to see the cookies work.

我希望这会有所帮助！

这篇关于jQuery-slideToggle保持打开状态直到关闭的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！