0

I am trying to log a hidden elements height after page re-size using.

http://dreamerslab.com/blog/en/get-hidden-elements-width-and-height-with-jquery/

The script works and logs a height on page load but after resizing it reverts to 0. I need to get the height of this element to fix my slidedown jump bug.

Currently I have

jQuery(document).ready(function(){


        doResize();
        jQuery(window).on('resize', doResize);      

        $("#one").hide();
        $("#two").hide();
        $("#three").hide();
        $("#four").hide();
        $(".orangetoggle").hide();
 });

  function doResize() {
        var orangeheight = $('.orangetoggle').actual('height');
        console.log(orangeheight);
  }

A live example of my bug is *hidden when you re-size the log outputs 0. But once you press the + / - it will log a height.

Thanks

Brent
  • 2,385
  • 10
  • 39
  • 63
  • Hidden elements don't have a height, show the element during the resize to get it's height then hide it again once the resize has completed – naththedeveloper May 24 '13 at 10:37
  • See this also: http://stackoverflow.com/questions/9117738/jquery-getting-a-hidden-elements-height – naththedeveloper May 24 '13 at 10:38
  • Yeah just thinking there must be some way I can do this..someone must of had this issue on resize. FDL they work but the problem is if I get the height by displaying then hiding it, when they toggle the +/- button and re-size it would close it. – Brent May 24 '13 at 10:44

1 Answers1

1

You can not get the height of hidden element. You can either show it get the height and then hide element or you can position the element on page in such a way that it will not be visible for user.

First way would be:

function doResize() {
    var orangeheight = $('.orangetoggle').show().actual('height');
    $('.orangetoggle').hide()
    console.log(orangeheight);
}
Milind Anantwar
  • 81,290
  • 25
  • 94
  • 125