jquery - 使用 jquery 自定义码头

Question

我正在尝试使用 jquery 创建一个显示/隐藏文档。现在我使用以下代码将顶部位置从 -200pc 设置为 0：

$('#play-the-series').click(function(){
            $('#main-nav #content').animate({
                    top: '0'
                }, 1000, 'jswing');
        });

我需要将位置切换回 -200px 以关闭扩展坞。我还想保持 100% 的宽度一致。

这是原始代码：

    $('#play-the-series').click(function(){
            $('#main-nav #content').toggle(function(){
                $(this).animate({
                    top: '0'
                }, 1000, 'jswing'),
                $(this).animate({
                    top: '-200px'
                }, 1000, 'jswing');
        }); 
    });

我很接近这个：

$('#play-the-series').click(function(){
        if($('#main-nav #content').css('top', '-200px')){
                $('#main-nav #content').animate({
                    top: '0'
                }, 1000, 'jswing');
            }else{
                $('#main-nav #content').animate({
                    top: '-200px'
                }, 1000, 'jswing');
            }
    });

但是else语句似乎不起作用...

这可以做到吗？

Answer 1

你需要top: '-200px'. 你错过了 px。

编辑： .toggle 不会做你认为它做的事情。请参阅切换文档。你应该这样做：

if ($('#main-nav #content').is(':visible'))
    $(this).slideDown(1000, 'jswing');
else $(this).slideUp(1000, 'jswing');