Ebook in iOS using CSS multi-column (calculate range of text in different column)

My first question here. Correct me if I've done anything wrong.

I've found a source here demonstrate how to paginate html using CSS multi-column. http://groups.google.com/group/leaves-developers/browse_thread/thread/27e4bf5ff3c53113/f137dc01b6d853b7

My question is: How to calculate the range / location of text in different column (page)?

For example, when changing the font size, the text in current page will jump to another page. To solve this, the program should save the current text location, and move to the correct page (column) after reformatting the web page.

It is also useful for im开发者_JAVA百科plementing bookmark function.

I think it should be done by javascript, but I'm new to javascript.

Any suggestions and tips are welcomed.

This is a bit of a general question, and very hard to answer, so I'll just try to point you in a direction I might try.

I have no idea how the layout of your page might look or function, but one way you could theoretically do this is by checking the text node of your 'column' whenever you change the font-size (presuming this font size change is implimented by a button click). So, for instance, say you have a div w/ the id #column_1, whenever someone clicks the button ui element you could evaluate the first several characters of #column_1, then search your string to find that text, and load whatever no. of characters you have defined as a 'page' around that text and call your render method to 'turn' to that page. So the flow of your function might look something like this:

zoomControl.click(click event){ //do something when you click the zoom control
var text = findTextofCurrentPage() //get the first bit of text of your current 'page'
renderLargerTextSize() //re-render your 'page' w/ larger text (for user feedback purposes)
renderPageWith(text) //render/navigate to the 'new' page wherein your the text in the variable 'text' can be found
}

Obviously this is a super generic 'idea' of what functions/methods you might use to make this happen, but I think if you dug into JS and say something like JQuery this sort of thing could be done relatively easily.