0

O.K. so I'm developing a website to feature my fiction writings. I'm putting all of my documents into XML files, pulling and parsing them from the server with PHP and displaying them on the page. You can visit the page here for an example.

As implied from the background image, What I would like to do is take the text and split it into two columns, (with the text from the first spilling into the second), then allow for the overflow to be paginated so that there is no scrolling necessary. In other words, I'd like for the text to read like a book with the paging based on how long the body of the XML document is.

I would like for this to be done on the server side using PHP or something similar. Is there a way I can do this with an xsl stylesheet or a server-side script? I've been looking everywhere and can't seem to find anything.

Any help is appreciated.

Mr. Mutant

Improve this question
1
  • The XML is because I want to use a standard ebook format for easier access from ebook and rss readers and the like - when the time comes for that stage. With the XML I can keep all the data separate from the actual web page and manipulate it from the server side - eliminating many cross-browser and device incompatibilities. Commented Jul 10, 2010 at 21:32

1 Answer 1

Reset to default
1

This is a surprisingly hard problem in general, and it's one you'll have no end of trouble with if you try to do it on the server. The problem with paginating HTML text is that where the page breaks go are entirely contingent on the client. The server doesn't know the client's screen resolution, font selection, or window size, and apart from the text itself those are the dependent variables for the problem.

I'd be surprised if at this point there weren't some jQuery library that just does this, but when I had to implement it myself about 7 years ago, here's the approach I took:

Create a div for each column. Each one contains the entirety of the document text. Style the divs with fixed line height. Put the column divs bottom in the document's z-order. Now you can lay out the rest of the page, leaving holes of known size in the layout that the divs can show through, and by manipulating the vertical position of each div you can control which line is the first to appear inside a given hole.

You can then let the client manipulate the font size, and as long as you recalculate the height of the holes and then reposition the divs properly, it will all magically work.

There may be ways of doing this in HTML5 that are easier; I would definitely look into that.

Improve this answer
Sign up to request clarification or add additional context in comments.

6 Comments

Thank you for your input, Robert. Most of the formating I have already done in CSS - so I have a definite size for text area (default 400x300 for each page without the padding) and a percentage for font size. I understand how your suggestion will work and will give it a shot - but what about the pagination and text flow? This seems to be the biggest problem.
Keep in mind I only wish for this format on the web page - to be viewed on pcs or laptops. I'm going to work on other methods to pull the files for mobile devices with smaller screens.
+1: Good explanation of the difficulty of doing this, and good basic tactic for solving. There definitely are some jquery plugins supporting pagination (google for jquery+pagination), but I'm not sure if they cover exactly this need.
That text box is going to be pretty small on a 1920x1200 monitor. Sizing it in ems will make its actual size a function of the font size and free it from resolution-dependency. The pagination and text flow is managed by adjusting the absolute position of the div containing the text - to page down, move the div up.
The text box will be the same size on all monitors - 800x600 pixels all together (making the monitor bigger doesn't make the viewing area smaller). I feel like this is a good size and can be viewed in its entirety on even small netbook screens (as most support 1024x600 - if not better). The sizing isn't really the issue here. I'm just wandering if anyone knows of a server-side method to parse XML strings of variable length with a (cached) paginated output to a designated on-screen area.
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.