縦書きエンジン「涅槃」について-#2

　本題に入る前に，久しぶりに坪でヘビさんを見たので，アップ。今年の正月に書いたように，実は，ヘビは苦手。しかし，本日撮影していて，なかなかかわいい目をしているな，と感じてしまった（汗ッ）。

　朝洗濯した夏蒲団を，しっかり乾かすために日向に干していたが，もうすっかり乾いたのでいれたあと，竿をしまおうと井戸のところに運んで，梁に手をかけたのだが，まさにそこに奴はいた。危うく触るところだったよー，ウウーッ。これ，青大将くんダヨネ。

　我が家は，もともとはヘビの多いうちで，その代わりにネズミを見たことがなかった。庭に弁財天があるんだけど，白蛇を祭ってるらしいし。しかし，このごろあまり見かけない。彼らも暮らしにくい世になったのかなあ。

　さて，本題。
　先日，「涅槃」のバージョンが上がっているのに気づいた。はてなに移られた「縦書き文庫 (id:convertical)」さんが，新しいバージョンについて使い方「縦書き、横書き自由自在！ あなたのブログをページ送りで表示させる最も簡単な方法」を書いておられたので，早速アップデートにかかったのだが，いやー，てこずったてこずった。

　もっとも，てこずったのは，前バージョンで我が家用にカスタマイズしていたところのうちのひとつだけ，なのであるが……

　他のところは，上のリンクの説明どおりでまったく問題なかった。

　何はともあれ，各ページが縦書きになるように， <meta http-equiv=”Content-Type” content=”text/html;charset=UTF-8″ /> の直後に，以下のコードをコピペ。
————————————————————————————————————————————————-
<link charset=”utf-8″ rel=”stylesheet” type=”text/css” href=”//nehan.googlecode.com/hg/nehan4.css” />
<link charset=”utf-8″ rel=”stylesheet” type=”text/css” href=”//nehan.googlecode.com/hg/jquery.nehan.css” />
<script type=”text/javascript” src=”//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js”></script>
<script charset=”utf-8″ type=”text/javascript”
src=”//nehan.googlecode.com/hg/nehan4.min.js”></script>
<script charset=”utf-8″ type=”text/javascript”
src=”//nehan.googlecode.com/hg/jquery.nehan.min.js”></script>
<script type=”text/javascript”>
$(function(){
　$(“.nehan-book”).nehan({
　　usePager:true, // falseにするとページャーなしで多段組
　　direction:”vert”, // 横書きなら “hori”
　　fontSize:16,
　　width:600,　　<<—- 800 に変更
　　height:400,　　<<—- 500 に変更
　　rowCount:1, // 2段組がよければ2にする
　　colCount:1, // 見開きがよければ2にする
　　readerElements:[“screen”, “pager”], // ページャーを先にしたければ逆順に
　　// より軽いページ送りがよければこっち
　　//pagerElements:[“left-next”, “right-prev”, “progress”]
　　pagerElements:[“left-next”, “indicator”, “right-prev”]
　});
});
</script>
————————————————————————————————————————————————-
　さらに，縦書きにしたいところを， <div class=”nehan-book”>～</div> で囲う。

　変えたのは， width と height だけ。まあ，このままだと，縦書きページが左によってしまうから，中央に来るように <table style=”margin: auto;”> は入れたけど。

　で，うまくいかなかったことの話。
　<icon> タグの仕様が変わったか無くなったかのようで，これを使っていた「｟」「｠」の表示がどうしてもうまくいかなかった。

　「｟」「｠」は JIS X 0213 に含まれていて，旧いブラウザ (OSも絡むと思う) で表示できないので，画像を使っていたのだが，時代の流れでもあるし，この際，旧いブラウザは見捨てることにした（汗+爆）。
　nehan4.css を調べてみると，90°回転について
　　　　　　　　　　.nehan-rotate-90{
　　　　　　　　　　　word-break:normal;
　　　　　　　　　　　overflow:visible;
　　　　　　　　　　　-webkit-transform : rotate(90deg);
　　　　　　　　　　　-webkit-transform-origin : 50% 50%;
　　　　　　　　　　　-moz-transform : rotate(90deg);
　　　　　　　　　　　-moz-transform-origin : 50% 50%;
　　　　　　　　　　　-o-transform : rotate(90deg);
　　　　　　　　　　　-o-transform-origin : 50% 50%;
　　　　　　　　　　　transform : rotate(90deg);
　　　　　　　　　　　transform-origin : 50% 50%;
　　　　　　　　　　}
となっている。で，どの文字を回すかは nehan4.min.js の中でやってくれているようなのだが，当然ながら，「｟」「｠」については nehan の考慮に入っていないから回してくれない。というわけで， nehan-rotate-90 を手差しで必要箇所に挿入した。

　それから，「ヰ」と「阿」を小文字として使えるように， custom.css を作り，もともとある２枚の css の直下に，以下を追加。
<link charset=”utf-8″ rel=”stylesheet” type=”text/css” href=”//o6asan.com/～/custom.css” />

　custom.css の中身は，次の通り。
　　　　　　　　　　.nehan-small{
　　　　　　　　　　　font-size: 60%;
　　　　　　　　　　}
　たったこれだけだから，わざわざ custom.css にするほどでもないのだが，どこをカスタマイズしたかを忘れる可能性があるので， custom.css は一種の備忘録だ。

　まっ，こんなとこ。

追記(11/5)：
　縦書き集の紹介入れるのを忘れてた。お暇なら，覗いてみてください。

追記２(2014/6/1) ：
　nehan5 について，「縦書きエンジン「涅槃」について-#3」を書いた。

追記３(2016/5/18) ：
　縦書き文庫さんの GitHub のリポの「nehan-book」利用方法について記事を書いた。