在这种情况下我如何切换动画

how can I toggle animation in this situation?

本文关键字：何切换 动画 这种情况下      更新时间：2023-09-26

我想这样做。当我点击about时，会显示left: 0, html关闭。当我再次点击，将显示左边:-100%，html大约。我怎么能意识到这一点呢?

var about = $('ul.about > li > span.activebtn');
var willshow = $('div.willshow');
about.on('click', function(){
        willshow.animate({
            'left': '0'
        }, 500);
        about.html('close');
        if($(this).html() == 'close'){
            about.click(function(){
                willshow.animate({
                    'left': '-100%'
                }, 500);
                about.html('about');
            });
        }
    });

可以使用元素的当前状态来设置被切换时的下一个值。试试这个:

var $about = $('ul.about > li > span.activebtn');
var $willshow = $('div.willshow');
$about.on('click', function() {
    $willshow.animate({ 
        left: $willshow.css('left') == '0px' ? '-100%' : 0
    }, 500);
    $about.text(function(i, t) {
        return t == 'close' ? 'about' : 'close';
    });
});

工作示例

相关文章：