青空文庫を縦書き表示。ひさしぶりに更新。
さてさて、ウェブブラウザ上で「青空文庫」に収録されている作品を縦書き表示で読めるというスクリプト『青空文庫を縦書き表示』です。
ご愛用していただいている人もいらっしゃるようで嬉しい限りなのですが、長い作品になると非常に縦長のページを出力してしまうのでスクロールが面倒くさいなぁ...と、常々おもっていたのです。
で、ちょっとAjax(死語?)っぽい仕掛けを導入して、作品の表示方法を「画面遷移なしのページ送り形式」に変更してみました。
実際に試してもらうのが一番なのですが、本文の下に表示されるナビゲーションの「←next」リンクをクリックしたらページ送り、「previous→」をクリックしたらページ戻し、という単純な操作になっています。JavaScriptをオンにしてご利用ください。
→ 青空文庫を縦書き表示
とりあえずFireFoxとSafariで表示確認を行いました。たぶんズレたりしない。大丈夫。
で、iPhoneのSafariから縦書き表示を使っている人のために、iPhoneを横置きしたときの画面サイズにジャストフィットするレイアウトを追加しました。「1ページの行数」「1行の文字数」それぞれのプルダウンで「iPhone」というのを選択してみてください。
...と、これ作って試してみたのですが、ジャストフィットすぎてナビゲーションが画面から外れてしまいますなぁ。早めに何とかします。しかも字が小さくて目が疲れるし。
ついでに不具合報告。
Internet Explorer8を使っていると、強調表示<b>〜</b>された文字列が行をまたいで存在する時に、表示がズレる気がします。これはIE8が悪いのではなくて、このスクリプトが吐き出すhtmlがルールに準拠していないせいなのですが、これを直すのはちょっと面倒なので暫く放置しておきます。IE8の「互換表示」をオンにするとズレが直りますので試してみてください。
ということで、今回の更新のまとめ。
ご愛用していただいている人もいらっしゃるようで嬉しい限りなのですが、長い作品になると非常に縦長のページを出力してしまうのでスクロールが面倒くさいなぁ...と、常々おもっていたのです。
で、ちょっとAjax(死語?)っぽい仕掛けを導入して、作品の表示方法を「画面遷移なしのページ送り形式」に変更してみました。
実際に試してもらうのが一番なのですが、本文の下に表示されるナビゲーションの「←next」リンクをクリックしたらページ送り、「previous→」をクリックしたらページ戻し、という単純な操作になっています。JavaScriptをオンにしてご利用ください。
→ 青空文庫を縦書き表示
とりあえずFireFoxとSafariで表示確認を行いました。たぶんズレたりしない。大丈夫。
で、iPhoneのSafariから縦書き表示を使っている人のために、iPhoneを横置きしたときの画面サイズにジャストフィットするレイアウトを追加しました。「1ページの行数」「1行の文字数」それぞれのプルダウンで「iPhone」というのを選択してみてください。
...と、これ作って試してみたのですが、ジャストフィットすぎてナビゲーションが画面から外れてしまいますなぁ。早めに何とかします。しかも字が小さくて目が疲れるし。
ついでに不具合報告。
Internet Explorer8を使っていると、強調表示<b>〜</b>された文字列が行をまたいで存在する時に、表示がズレる気がします。これはIE8が悪いのではなくて、このスクリプトが吐き出すhtmlがルールに準拠していないせいなのですが、これを直すのはちょっと面倒なので暫く放置しておきます。IE8の「互換表示」をオンにするとズレが直りますので試してみてください。
ということで、今回の更新のまとめ。
- 作品の表示方法をAjaxっぽいページ送り形式に変更。
- iPhone用のレイアウトを追加。
- IE8で表示がズレる不具合あり。IE8の「互換表示」モードなら大丈夫。
コメント