slideup,change content,then slide down with jQuery

I develop following code to slide up register panel, then change its content and then slide down logged in panel.

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);
}

but it changed content ,then slide it up and slide it down. what should I do to changing content after sliding up?

preguntado el 31 de julio de 12 a las 15:07

4 Respuestas

The content enters before the slideUp. Do it this way:

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

Respondido 31 Jul 12, 16:07

Use the callback function from slideup to wait until the slide finish and then execute what you want, for example:

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

Respondido 31 Jul 12, 15:07

Usted puede ensayar lo siguiente

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

Ver demo aquí http://jsfiddle.net/UdagC/

Respondido 31 Jul 12, 16:07

Intente algo como esto;

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

where 'slow' is what ever speed you actually want.

Respondido 31 Jul 12, 16:07

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.