godsplane, в целом там проблем нет
верхний див делается прозрачным для мыши pointer-events: none;
текст в инпуте делается прозрачным color: transparent;
на инпуте слушается событие input и содержимое дублируется в див с необходимыми обработками.
Правда курсор тоже станет прозрачным, и его тоже придется как-то эмулировать, вот это, пожалуй, единственная проблема.
Blondguy, слайдер, который вы будете использовать, дает дополнительные классы для каждого слайда, на них следует опираться. Виталий Першин в соседнем ответе во втором варианте это продемострировал.
Это просто холст для рисования, это не картинка, ее не скачаешь, пока она не нарисуется.
Найдите код, который рисует на холсте. Там могут быть варианты.
Может быть страницы подгружаются в виде графического файла и потом копируются на холст.
Может быть страницы книги подгружаются в виде текста и потом отрисовываются на холсте.
Может еще как-то.
Когда найдете источник данных для рисования, можно уже будет думать, как дернуть данные из этого источника.
Почему не понятно? В строковом контексте между строками подразумевается наличие некоторого промежутка. Но присутствует он только при выравнивании по базовой линии (vertical-align: baseline), это значение по умолчанию. Стоит изменить на любое другое значение, и отступ пропадёт.
