jquery 动画幻灯片不工作

Question

这是我的代码，但如果我将幻灯片放入变量中则无法使用。

只是淡入淡出工作

$('.sidebar-toggle').on('click', function(){

    if( $('.sidebar-left').length > 0 ) {
        var SideWay = 'left';
        var Sidebar = $('.sidebar-left');
    } else {
        var SideWay = 'right';
        var Sidebar = $('.sidebar-right');
    }

    var SidebarWidth = Sidebar.css('width');

    if( Sidebar.css('display') == 'none' )
    {
        Sidebar.fadeIn('fast').animate({ SideWay : '0'}, 400);
    } else {
        Sidebar.stop().animate({ SideWay : '-' + SidebarWidth}, 500).fadeOut();
    }

});

Answer 1

试试这个

$('.sidebar-toggle').on('click', function(){

    if( $('.sidebar-left').length > 0 ) {
        var SideWay = 'left';
        var Sidebar = $('.sidebar-left');
    } else {
        var SideWay = 'right';
        var Sidebar = $('.sidebar-right');
    }
    var animateIt = {};
    var SidebarWidth = Sidebar.css('width');

    if( Sidebar.css('display') == 'none' )
    {
        animateIt[SideWay] = '0';
        Sidebar.fadeIn('fast').animate( animateIt , 400);
    } else {
        animateIt[SideWay] = '-' + SidebarWidth;
        Sidebar.stop().animate( animateIt , 500).fadeOut();
    }

});

你可以看看这个Using a variable for a key in a JavaScript object literal

虽然我不知道您的完整代码，但这只是 Example 它如何工作的

jquery 动画幻灯片不工作

jquery animate slide not working

javascript

jquery

rights

slide

jquery-animate