0

I'm trying to set the width and height of a google chart object as the container div. To do that all I need is set an object attribute: var options = {'width':$('#chart').width(),'height':$('#chart').height()}; This actually works, but only if $.fn.width() returns the pixel value. This happens when the element is displayed, but not if the item is not. Since I need to update the chart when the element is hidden, how can I get the dimensions? This is a fiddle which helps you understand better my problem (my bad English does not): https://jsfiddle.net/Lj0daj27/

Franz Tesca
  • 255
  • 1
  • 5
  • 19
  • [similar case](http://stackoverflow.com/questions/1472303/jquery-get-width-of-element-when-not-visible-display-none) – user2970115 Aug 03 '16 at 03:34
  • Your English is totally fine. –  Aug 03 '16 at 03:37
  • @user2970115 I knew that method, but my case is different because the element of which I want to know the width is a children of a hidden element and not hidden itself. If I wanna do like that, I should set visibility to hidden and display to block, but that would be visibile (for very little time) to the user because I have much content below. Instead, I would like to do that keeping the content not displayed – Franz Tesca Aug 03 '16 at 03:39

1 Answers1

0

document.getElementById('answer').innerHTML = document.getElementById('element').scrollHeight + "px tall!";
#element {
  height: 200px;
  width: 250px;
  padding: 20px;
  background: blue;
  text-align: center;
  color: white;
  opacity: 0;
}
<div id="element">
  This is my element!  
</div>

<div id="answer">
    
</div>

I might consider using the scrollHeight and scrollWidth properties to get these dimensions. It should work well for hidden elements as well.

http://www.w3schools.com/jsref/prop_element_scrollheight.asp

Alex MacArthur
  • 2,220
  • 1
  • 18
  • 22
  • If you're using `display: none` to hide the element, I don't believe there is a way to find its dimensions. I'd recommend either hiding the element via `opacity`, or somehow briefly displaying the element so you can store it's dimensions. It really depends on the context of your element. – Alex MacArthur Aug 03 '16 at 03:37