• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
[solved] Jquery animate; how to return to previous height?

#1
[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).

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

#3
[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.


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2020 MyBB Group.