ruby_enabler2.js - 適切なルビ表示を行うためのJavaScript

ウェブページでルビを使（つか）いたいけれど、ブラウザによっては上手（うま）く表（ひょう）示（じ）されない場（ば）合（あい）がある、どうしよう…というときに、この ruby_enabler2.js をお使いください。

作成したページに ruby_enabler2.js を設置するだけで、

  • 主要なブラウザ *1上で、
  • HTML5形式・XHTML1.1(HTML4)形式のどちらの書式で書かれたルビ *2も、

かなり良い感じにレンダリングすることができます。

ダウンロード

RUBYタグ周りの書式とブラウザ互換性、ruby_enabler2.jsの動作について

ルビ周りのHTMLコーディングは、以下のような書式が混在している状況だと思います。

  1. XHTML1.1 / HTML4 の書式
  2. HTML5草案 の書式
  3. HTML5最終勧告 の書式

このうち 2 は 3 に概ね内包されるので良しとして、

あなたのウェブページに ruby_enabler2.js を仕込めば、HTML/XHTMLのバージョンによるルビ書式の違いに関わらず、

  • Google Chrome（かなり古いバージョンまで大丈夫な筈ですが未確認）
  • Firefox（かなり古いバージョンまで大丈夫な筈ですが未確認）
  • Internet Explorer 9以降（IE8は動作対象外）
  • Safari 7以降（Safari 6でも何となく動きます。5は動作対象外）
  • 旧Opera 最終バージョン
  • 新Opera 全てのバージョン
  • Android Browser 4.0
  • その他、新しめの WebKit/Blink系ウェブブラウザ

からの閲覧時に、狙ったとおりにルビの表示を行えます。

参考文献など

HTML5でのruby, rb, rt, rtcタグの詳細を知りたい場合は、W3Cの公式ドキュメント（一部日本語｜英語）を参照してください。

XHTML1.1のruby, rb, rt, rbc, rtcタグの詳細は、W3Cのドキュメント "Ruby Annotation"（英語）をご覧ください。

HTML5 最終勧告に沿ったRUBYタグ周りの書式と、ruby_enabler2.js の動作の実際を確かめたいときは、こちらのページ → 動作見本【HTML5形式のルビ】を、従来の XHTML1.1(HTML4)の例をご覧になりたい場合は 動作見本【XHTML 1.1 / HTML4 形式のルビ】 をご覧ください。

ruby_enabler2.js を使用しない、ウェブブラウザの素すの表示状態を知りたい場合は 各ウェブブラウザでのルビの実装状況 で確かめることができます。