How to take div height from javascript when div element height is auto

Posted on by WPAPI

Sponsors

Many times we need to get the div or any DOM elements height and width when these properties not defined.

Lets say I kept div height auto and width as 200px fix and data is dynamic for eash user. So how we can get the div height.

We can use two javascript functions for fetching the div height.
1. offsetHeight – this will return the value which are specified in your CSS

2. clientHeight – this function will return real inner height of element that does not matter about CSS.
I recomend to use this function.

Exmaple code as follows:

<style>
#wordpressapidiv{ width:200px; height:auto;border:#ccc 1px solid}
</style>
<div id=\"\wordpressapidiv">
This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content.
This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content.

This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content.
This is dummy content. This is dummy content.
</div>

<script>
function getDivHeight(divID){
gd = document.getElementById(divID).clientHeight;
alert(gd);
}

function getDivWidth(divID){
gw = document.getElementById(divID).clientWidth;
alert(gw);
}

</script>

<input name="test" type="button" onclick="getDivHeight('wordpressapidiv')" >

Function above code you can fetch the div height and width using the javascript.

Incoming search terms:

You may like following Articles!

58 thoughts on “How to take div height from javascript when div element height is auto”

  1. Pingback: Xbox 360 Console Repair Convert Unable Xbox In Workable Console | Xbox 360 Pro Bundle

  2. Pingback: Underdog NY makes finalist list for Race to the Top | Paperless Media

  3. Pingback: Fully Managed Windows Dedicated Server Hosting | Dedicated Website Hosting Info

  4. Pingback: What Marie Osmond’s son wrote in suicide note | Paperless Media

  5. Pingback: Was spricht gegen Billigwelpen ?

  6. Pingback: Smoking Hot Blonde Veronika | Porry Babes

  7. Pingback: Veronica Ricci | Porry Babes

  8. Pingback: Intense Butt and Legs – Workout | Waist Belt , waist-belt.com

  9. Pingback: SanDisk Sansa Clip 2 GB MP3 Player (Black) | Bestsellers in Electronics Reviews

  10. Pingback: i m a gal 19 yrs yr old gal. i m weghing 68kgs.plz suggest some methods for fat loss? | Buy Fat Loss 4 Idiots

  11. Pingback: Speed, Long Tail… | JimRGraham.com

  12. Pingback: Apolo Ohno’s Olympic Workout | Waist Belt , waist-belt.com

  13. Pingback: Get Your own search site for FREE to Earn Commissions | Trace Lost Relatives.com

  14. Pingback: Jessica Simpson opens up about weight, John Mayer on ‘Oprah’

  15. Pingback: Vibram Five fingers Review

  16. Pingback: Auto Content Cash – Content For Automated Cash? | Alex Goad Auto Content Cash

  17. Pingback: 2-14-10 Tormentos.wmv | Cozumel Blog

  18. Pingback: Dance Fitness Workout for Beginners Tahitian Hip Hop DVD | Waist Belt , waist-belt.com

  19. Pingback: What are some effective ways to lose fat, not weight? | Buy Fat Loss 4 Idiots

  20. Pingback: lose weight? | Buy Fat Loss 4 Idiots

  21. Pingback: Weight loss? | Buy Fat Loss 4 Idiots

  22. Pingback: Information on a Fireplace Vacuum

  23. Pingback: Easy Slipper Knitting Patterns Are Great For Beginners

  24. Pingback: Velcro Bedroom Slippers

  25. Pingback: educational toys electronic kits circuit | Hottest Holiday Toys

  26. Pingback: UK’s economic recovery ‘is under threat’ – Telegraph.co.uk | Forex Megadroid System

  27. Pingback: best systems of psych for understanding and development? | Personal Development Guide

  28. Pingback: 1967 DODGE DART GT $15,995 |

  29. Pingback: unique green couture | Terry Cloth Couture

  30. Pingback: uberVU - social comments

  32. Pingback: Beach Wedding | Wedding Planning

  35. Pingback: My Blog Title

  44. Help!!!! Neither of the 2 properties clientHeight and offsetHeight works for me! Could some one suggest any alternatives to find out the height of a div dynamically? Thanks a ton in advance.

    Reply ↓

  45. Hi all,
    I have to show a div onmouseover of an icon. It does get shown up, but in the bottom, so am unable to see the content. How do I format the div so that the div shows up right next to the icon itself? P.S. The div is actually a label created by a certain Label.js file. Could someone help me asap with this please? Thanks a ton in advance.

    Reply ↓

  48. Nice post! You truly have a wonderful way of writing which I find captivating! I will definitely be bookmarking you and returning to your blog. In fact, your post reminded me about a strange thing that happened to me the other day. I’ll tell you about that later…

    Reply ↓

  58. Thanks for the tips shared on your blog. Something else I would like to mention is that fat loss is not about going on a dietary fad and trying to lose as much weight that you can in a few months. The most effective way to shed pounds is by using it slowly and right after some basic guidelines which can allow you to make the most through your attempt to lose weight. You may understand and already be following some tips, but reinforcing expertise never affects.

    Reply ↓

Leave a Reply