Embedded epub not scaling with viewport

Asked Dec 14 '16 at 19:21

Active Dec 14 '16 at 20:38

Viewed 284 times

Here I have posted a fusion of Epub.js with wow book by trying to put individual epub pages into wow book for the page curl effect.

Essentially, my boss wants an epub with page curl online that is scalable to screen size. Since it is a magazine that is published, it needs a fixed layout that is scalable.

The problem as in the coverpage of the link I sent is that as you adjust the screen size, although the page viewport adjusts, the actual epub embedded does not and turns into scrolling kind of deal. This obviously will not work with a digital magazine.

Any ideas on how to get this to scale?

<script>
    var Book = ePub("CDX17spreadcover.epub");
    Book.renderTo("epub");
</script>

<div class='cover'>
    <div id="epub"></div>
</div>

edited Dec 14 '16 at 20:38

RPichioli

3,245
2
25
29

asked Dec 14 '16 at 19:21

William Malcolm

1

I'm not quite understanding the issue? The book scales fine. – Nathaniel Flick Dec 14 '16 at 19:39
Were you able to see the cover that said California Dairy Magazine? It does no scale with the book. So while the book scales, the epub content does not. – William Malcolm Dec 14 '16 at 19:50
No the cover is completely blank. I'm using Firefox latest on a Mac. – Nathaniel Flick Dec 14 '16 at 19:51
try making your browser window bigger, because the graphic is only on the top of the page – William Malcolm Dec 14 '16 at 19:53
I see it now, but in Chrome, not Firefox. – Nathaniel Flick Dec 14 '16 at 19:57
Do the same thing with the cover that you did with the page with the cat image on it, should work fine that way. – Nathaniel Flick Dec 14 '16 at 19:58
oh dang, I see it works fine on Firefox. How can I get it to display like that on safari? – William Malcolm Dec 14 '16 at 19:59
well, the cat image is a jpg, not an embedded epub – William Malcolm Dec 14 '16 at 20:00
Ok, sorry for my fumbling around here. :) Your epub page creates an iframe and you have to handle that specifically so it's responsive. Check out this thread for some css to do the trick: http://stackoverflow.com/questions/17838607/making-an-iframe-responsive. The first issue is to make sure your epub document you're iframing in is, itself, responsive or no amount of css will fix that. – Nathaniel Flick Dec 14 '16 at 20:08

Embedded epub not scaling with viewport

0 Answers0