[solved] Jquery animate; how to return to previous height?

[solved] Jquery animate; how to return to previous height? - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Libraries & Helpers (https://forum.codeigniter.com/forumdisplay.php?fid=22)
+--- Thread: [solved] Jquery animate; how to return to previous height? (/showthread.php?tid=43942)

[solved] Jquery animate; how to return to previous height? - El Forum - 07-28-2011

[eluser]umbungo[/eluser]
I have a variable height div which is hidden using a nice JQuery animation, which changes the height (etc) of the div. How can i return the height to what it was before when un-hiding??

Simplified code example;

Code:
$(".open").live('click', function() {

        $('#float').show();

        $('#float_inner').animate({height: '"' + h + 'px"', opacity: 1}, "400");

    });

    $('.close').live('click', function(e) {

        e.preventDefault();

        $('#float_inner').css('overflow', 'hidden');

        $('#float_inner').animate({height: "30px", opacity: 0.3}, "400", function() {

            $('#float').hide();

    });

I tried setting a variable or an element attribute [= element.height()] in the close function and reading it in the open function, but had no luck.. the open just had the closed height (30px).

(NB: i have used height: 100%, and it 'works' but is no good for me because it messes up the animation, which works fine when a height is set).

[solved] Jquery animate; how to return to previous height? - El Forum - 07-29-2011

[eluser]waynhall[/eluser]
Is your variable declared outside the function?

[solved] Jquery animate; how to return to previous height? - El Forum - 07-29-2011

[eluser]umbungo[/eluser]

Code:
$(".open").live('click', function() {

        $('#float').show();

        if(h>1)$('#float_inner').animate({height: h + 'px', opacity: 1}, "400");

    });

    $('.close').live('click', function(e) {

        e.preventDefault();

        h = $('#float_inner').height();

        $('#float_inner').css('overflow', 'hidden');

        $('#float_inner').animate({height: "30px", opacity: 0.3}, "400", function() {

            $('#float').hide();

    });

I found this worked reasonably.