h2v.js - Webページの文章を縦書きで表示するJavaScript。

作ってみた。ここから下の本文が縦書きで表示されている筈。
IE 7以前のバージョンや、携帯・スマートフォンブラウザで閲覧している人、その他レイアウトがズレているときは、↓この辺に表示されている「縦→横切替」をクリックしてください。

どうだ!縦書きですよ。

JavaScriptファイルと専用スタイルシートを読み込んでやれば、縦書きにしたい部分をid付きのdivで囲んでやるだけ。簡単でしょ?

ここで縦書きが上手くいっているということは、あなたのブログにも縦書きを導入可能ということですね。
縦書きエリアには、このようにスタイル付きのdivや、その他のhtml要素を含むことができます。
縦書きレイアウトがウザい人はここをクリックしてもらえば横書き通常レイアウトに戻ります。もういっかいクリックすると再び縦書きになります。

詳しいことはこちらのh2v.jsページをご覧になってください。

まだまだ「マルチブラウザで縦書きを実現する」というのがほぼ達成できただけで、スクリプトのチューニングなどはこれからです。ファイルサイズも思ったよりデカくなってしまったしなぁ…。

いろいろご意見頂ければと思います。
…ということで。

カテゴリ: