3

I'm writing a small program on the iPad whose task is to display the contents of an html file. I use document.documentElement.scrollHeight (pageYOffset etc.) to paginate.

My problem is with images. Sometimes an image gets cut in half such that 50% of the image is on page 1 the other 50% is on page 2. How can I fix this?

Thanks.

Taryn East
  • 27,486
  • 9
  • 86
  • 108
Sebastian
  • 31
  • 1
  • http://stackoverflow.com/questions/2649169/print-styles-how-to-ensure-image-doesnt-span-a-page-break <- This is basically the same problem. Not sure how well the `page-break` properties work on screen, though... – peirix Aug 23 '11 at 06:39
  • 2
    @peirix – They are ignored, as per spec. `page-break` doesn't apply to continuous media. – Quentin Aug 23 '11 at 06:47
  • Hmm so how the other apps (readers) do this? – Sebastian Aug 23 '11 at 06:55
  • Why not use a script detection of an element like [this](http://stackoverflow.com/questions/487073/jquery-check-if-element-is-visible-after-scroling) ? – Galled Nov 15 '11 at 15:59

1 Answers1

0

Why not style your images with CSS and use a percentage value so that it scales to fit the screen?

You might also want to checkout Responsive Design.

diggersworld
  • 12,770
  • 24
  • 84
  • 119