toggle kana/kanji

Discussion in 'Javascript' started by Fabian, Jan 7, 2004.

  1. Fabian

    Fabian Guest

    I have a page (ok, will have a page) written in Japanese. As we all
    know, Japanese is written with some pretty funky characters, and it is
    conventional to write the so-called furigana above these kanji, as a
    pronunciation guide. Imagine it as lots of little inline tables as

    za kat sed hau du yu du
    The cat said how do you do

    This can be rendered properly using the html <RUBY> tag. Unfortunately,
    that tag is not properly supported across browsers, and msie, the only
    one I know that does support it, wont allow it to be manipulated
    properly by javascript. So I think it is best avoided.

    Anyhow, what I want is the following:

    The ability to toggle individual kanji/furigana pairings by clicking on
    that bit of text. Ideally, this will involve an absolute minimum of
    coding within the body of the document, as I expect there will be many
    such pairs.

    How can I do this?
    Fabian, Jan 7, 2004
    1. Advertisements

  2. Fabian

    Bill Guest

    I think you'll have to use fairly large kanji that match up with the
    smallest font size you can get for the kana (but make them large enough
    to read on a crappy display). then play around with tables. Once you
    have them positioned, you can put <div> tags inside the table cells and
    make things appear and disappear.

    Neat idea of you can do it. I've just been working on having the reading
    appear in a line after the kanji.
    Bill, Jan 8, 2004
    1. Advertisements

  3. AFAIK Japanese has glyphs, not characters. But understood.
    (X)HTML does not have a <RUBY> tag. In fact, _W3C's_ Ruby (apparently
    there is an object-oriented scripting language of the same name[1]) is
    another markup language which can be embedded in XHTML 1.1 documents
    through a module for XHTML 1.1.[2] The "ruby" element is, of course,
    the root element of the embedded markup.

    As XHTML is not, alas.
    Why not admit that IE is not capable and serve it (and
    other not-supporting UAs) a page without Ruby markup?
    There is a good[tm] and a bad[tm] solution.

    The good[tm] one is CSS.

    CSS2, using floats and toggling child elements of each float:

    CSS3, using its Ruby Module (not yet a recommendation) and
    toggling properties of child elements:

    The bad[tm] one is tables, toggling the visibility of table
    cells ([X]HTML "td" elements).

    Note that "click" events bubble by default.


    Thomas 'PointedEars' Lahn, Jan 22, 2004
  4. Fabian

    Fabian Guest

    Thomas 'PointedEars' Lahn hu kiteb:
    For all practial purposes, the two words have the same meaning. The only
    reason Japanese people don't call them characters is because
    'kyarakutaa' means things like Mickey Mouse, Fred Flintstone, or the
    Stay-Puffed Marshmallow Man.

    What I want is a solution whereby by default the user agent will see one




    Depending on the capabilities of the agent. Further, I want the user to
    have teh option to toggle the display of the text and ruby. There will
    be 3 options:

    Show all
    Show base text only
    Show ruby only

    Ideally it will be functional it at least both msie and netscape (latest

    From the example they give, this would be a great way to do drop-caps,
    but since the main text will flow around both sides, I'm not sure it
    would work. On really long examples, the ideal display would be
    interleaved lines.

    Since there is no browser (no common one anyway) that both understands
    the ruby tagset and allows it to be manipulated, I'll pass on this

    I think I'll have to give this one up as a not yet possible across
    browsers task.
    Fabian, Feb 1, 2004
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.