jquery - 上滑，更改内容，然后使用 jQuery 向下滑动

Question

我开发了以下代码来向上滑动注册面板，然后更改其内容，然后向下滑动登录面板。

function ValidLogin(data)
{
    var content = null;;
    content = '<a id="link-show" class="g-button g-button-red" href="<?php echo base_url(); ?>index.php/cv/show/';
    content += data.id;
    content += '">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;www.onlinecv.ir/index.php/cv/show/'
    content += data.id;
    content += '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;';
    content += 'رزومه ام را نشانم بده';

    content += '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a id="link-signout" class="g-button g-button-red" href="#';
    content += '">&nbsp;&nbsp;خروج&nbsp;&nbsp;'
    content += '</a>';
    content += '</span>'


    $("#signup-button").slideUp(1500).delay(1500);
    $("#signup-button").html(content).slideDown(1500);
}

但它改变了内容，然后将其向上滑动并向下滑动。上滑后更改内容应该怎么做？

Answer 1

内容在 slideUp 之前进入。这样做：

$("#signup-button").slideUp(1500, function() {
    $("#signup-button").html(content);
}).slideDown(1500);

Answer 2

使用 slideup 的回调函数等待幻灯片完成，然后执行您想要的，例如：

$("#signup-button").slideUp(1500, function(){
    // do what you want here
    // then slidedown again :)
});

Answer 3

你可以试试这个

var slider = $("#signup-button");
slider.slideUp(1500, function(){        
        slider.html(content).slideDown(1500);                        
});

在此处查看演示http://jsfiddle.net/UdagC/

Answer 4

尝试这样的事情；

$("#signup-button").slideUp('slow',function(){
     $("#signup-button").html( content ).slideDown('slow')
});

“慢”是你真正想要的速度。