bookreader.jsbookreader.jsbookreader.jsbookreader.jsは、長文を縦スクロールではなく、横スクロールで表示し読みやすくするJavaScriptライブラリです。※ダウンロードの詳細については、こちらのページをご覧下さい。このページで体験してみて下さい。キーボードの[→]/[←]キーが、「進む」あるいは「戻る」に対応します。画面上に表示される、半透明の▶/◀ボタンをクリックしてもOKです。使い方の詳細は「ヘルプ」を参照ください。幸いにしてさまざまな方からフィードバックをいただきました。ありがとうございます。それを元に機能の絞り込みとWEBサイトへの「組込み方」について検討を行っています。実装の方針が定まった、という段階ですが次期0.8.x系のサンプルはこちら(※IE未調整)。ポイントは、全画面化、縦幅(行数)可変、文字列幅をピクセルベースで計算、他ライブラリへの依存を除去、ブラウザのページ内検索対応など。lightbox的な使用が可能になる予定です。bookreader.jsのメリット一般的なWEBページの画面構成は縦スクロールが基本です。スクロールと視線の同期が頻繁に発生し、長文(数十〜数百ページ)を読むには適しません。bookreader.jsでは、テキストを予め複数の「ページ」に分けておき、「ページめくり」のような横スクロールに置き換えることで、視線移動を減らしています。bookreader.jsを使うと、HTMLでありながら、テキストを簡単に段組みにすることが可能です。ライブラリを読み込むだけで良いので、既存のページに導入するにも簡便です。トップページなどは通常の構成で、読み物のページだけbookreader.jsを適用すると良いようです。New!!サンプル評論・物語などの長い文章を表示したサンプルを用意しました。)以上、青空文庫から。※「青空文庫ゲートウェイ」と「テーマ」のページも参照ください。短歌とエッセイ」から。ホームページへの導入bookreader.jsを導入したい部分のHTMLをDIVタグで囲み、そのIDを"bookreader"とします。bookreaderの各ライブラリを読み込みます。ページを参照ください。表示フォントについて環境によって、導入されているフォントは千差万別です。(なければ、他のゴシック系フォント)を使うようにしています。bookreader.jsはOSを判別して、適切なcssファイルを読み込みます。フォントを変えたい場合は、独自のテーマファイルを作成して下さい。テーマbookreader.jsは、テーマを指定して表示スタイルをカスタマイズすることが可能です。一度に表示可能なページ数ハードウェアのスペック、OS、ブラウザによって、実用的な範囲は変わってきます。20〜30に留めておいて、HTMLファイルを章ごとに分割するのがオススメです。最近のMac+Safari環境では100ページ以上でも、かなりスムーズに動きます。試した限りで最大は、マロの「家なき子」ですが、これだと文字サイズ大で500ページ強、普通に読めます。(ただ、少し前のWindowsのCeleronノートPCとかだと数十ページで限界でしょう)マルチカラムについてCSS3で対応が予定されている「マルチカラム」ですが、あえてそこをJavaScriptで(ある意味)強引に、実装するこのbookreader.js。その意味では、css3-multi-column.jsなどに通ずる部分があります。いえ、CSS互換が目的ではないので、方向性は異なります。bookreader.jsの試みは、「紙」的な「目に優しい」レイアウトをWEBに持ち込むことです。TEXに似た画像の再配置機能などはその一つです。(CSS3の動向次第では、マルチカラム化のロジックをCSSに任せることもできるかもしれませんが、現時点でそれが可能かは不明です。どちらにしてもブラウザ対応が進むのは数年先でしょうか..)ライセンスライセンスはAPL2ですので、本スクリプトの使用は基本的にフリーですが無保証です。サイトに採用していただいた場合は、参考にしたいのでご一報いただけたら嬉しいです。Designが行っています。方に書き込んでもらってもOKです。