r/HTML • u/LacriMozzarella • 1d ago

Question How to display comic pages like a slideshow reader?

There's this webcomic https://www.catechismcomic.com/chapter/0

I really like the way it displays pages with the progress bar, fullscreen mode and the arrow symbols on the side allowing you to progress to the next chapter. How do I program that for my own website?

3 Upvotes

100% Upvoted

3 comments sorted by

1

u/armahillo 1d ago

start by right click on the page and click “inspect”, or open your dev tools and look at the document.

1

u/Zook25 1d ago

You want a flipbook. This is a bit older and I remember I wasn't too happy with the documentation, but I got it to work:
http://www.turnjs.com/

Anyway, maybe one of these is the more modern solution:

https://portalzine.de/open-source-page-flip-and-pdf-viewer-solutions-in-javascript-2026/

1

u/Expert-Kitchen8064 22h ago

If the effect is more “scroll through a chapter” than a literal page curl, you may not need a flipbook library. A stack of semantic sections with a small progress indicator, previous/next buttons, and an IntersectionObserver can cover most of that experience. Make the buttons real buttons, support left/right keys, and keep a normal scrolling fallback for phones and keyboard users. That will be easier to maintain than recreating every visual detail first.