<!DOCTYPE html> <html> <head> <link rel="stylesheet" href="comic_reader_test.css"> <link rel="stylesheet" href="comic_reader.css"> </head> <body> <div id="reader-frame"> <div id="reader-content-frame"> <div id="reader-pages" data-pages-width="2481" data-pages-height="3503" hidden> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P01.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P02.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P03.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P04.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P05.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P06.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P07.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P08.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P09.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P10.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P11.jpg"/> <img loading="lazy" src="https://www.peppercarrot.com/0_sources/ep35_The-Reflection/hi-res/en_Pepper-and-Carrot_by-David-Revoy_E35P12.jpg"/> </div> <div id="focus-overlay"> <div class="top"></div> <div class="left"></div> <div class="center"></div> <div class="right"></div> <div class="bottom"></div> </div> <div id="nav-controls"> <div class="left" id="nav-left" onclick="moveReader(false,false)"></div> <div class="right" id="nav-right" onclick="moveReader(true,false)"></div> </div> <div id="help-menu"> <div id="help-controls" style="opacity:1; transform: translate(0,0);"> <div><div class="key">←</div>/ scroll up / clic : previous</div> <div><div class="key">→</div>/ scroll down / clic : next</div> <div>-----------------------</div> <div><div class="key">F</div>: Toggle fullscreen</div> <div><div class="key">P</div>: Toggle progress bar</div> <div><div class="key">V</div>: Toggle panel / page viewing mode</div> </div> </div> </div> <div id="reader-progress-container"> <div id="reader-progress-bar"></div> </div> </div> </body> <script src="zooms_data.js"></script> <script src="comic_reader.js"></script> </html>