how to find the height of html content

Question

Hi, I am trying to display 10 html pages as a single document,with 10 chapters. I am using Webkitgtk+ engine to render the HTML pages. I am getting the content of each html files and concatenating all of them to create a
single 'char *content' and using webkit_web_view_load_html_string(WebKitWebView *web_view, const gchar *content, const gchar *base_uri); this function to load all the HTML files, as a document.

Now i am trying to build a 'table of contents(toc)' for this document, which displays all the chapter names in order. My requirement is, when i click on a particular chapter in toc, the document should scroll to that point. For that i need to know height of each chapter ( height of each html file content).

The point to be noted here is, the width of the document can changed and as HTML is reflowable, as width increases height decreases and vice-versa. So each time when height changes i need to find out the current height of each HTML page(or chapter) and hence calculate the distance to be scrolled.

How can i find out the height of content of HTML page dynamically ? Thank you for the answer....

Answer 1

Why not just put named anchor tags between the chapters and link to those?

<a name='chapter_3'>&nbsp;</a>

Then your link can look like:

  <li>
    <a href='#chapter_3'>Wherein Mr. Toad Gains A Fresh Perspective</a>
  </li>

Answer 2

You can use Javascript to get the height of a div. So, wrap each chatper in a div, give it a name or class name, then use javascript to find the height of the div.