あれこれポップアップ・動作サンプルぺージ

「あれこれポップアップ」のためのサンプル文書。内容は特に無関係です。リンクアンカーや、点線の下線の表示されてる箇所や、リンクバナーや、引用部分などなどにマウスポインタをかざして、1 秒ほどじっとしてみてくださいな。

なお、Mozilla 他の Gecko 系ブラウザ、 Safari 等の AppleWebKit 系ブラウザ、 WinIE の 6 あたりのブラウザでないときっと動作しません。そして JavaScript と CSS が有効でないと動作しないのであしからず。

ポップアップスタイル選択：

サンプル 1 : よくある日記テキスト

Apple が WaSP の偉いさんと契約したらしー。

MacMinuteが、Appleは同社のサイトデザインを新しくするため、Webの標準化を推し進める上で重要な役割を担ってきたWeb Standards Project(WaSP)の元リーダーで、現在名誉職にあるJeffrey Zeldman氏と、同団体の現リーダーであるDouglas Bowman氏と契約したと伝えていました。

ほう。ユーザビリティは悪くないものの、画像ばっかしで鬼テーブルレイアウトびしばしでアクセシビリティ激悪な Apple サイトがどうなるのか見物。単に div 厨化して終わったりして。海外における自称「 Strict HTML 化しますた！」って奴は、単にテーブルレイアウトをやめて div 厨化しただけの事を指すらしいと、よくそふぃあさんが嘆いていたり。

画像形式は PNG 形式のみです。ぼくは PNG 推進派なのですヨ。もしどうしても GIF 版が使いたいという方がおられましたらば、ご自身の責任でもって GIF に変換して使ってください。

サンプル 2 : 拡張属性 ap:banner テスト

この部分の HTML ソースは以下のようになってます：

<ul>
    <li>
        <a href="http://www.remus.dti.ne.jp/~a-satomi/"
           ap:banner="http://www.remus.dti.ne.jp/~a-satomi/common/img/banner/nyan2h_ban.png"
           title="娘娘飯店しるきぃうぇぶ">娘娘飯店しるきぃうぇぶ</a>
    </li>
    …
</ul>

サンプル 3 : class="AP-noPopup" テスト

  1. S.O.B
  2. S.O.D.

この部分の HTML ソースは以下のようになってます：

<ul>
    <li><abbr title="Sabotage Organized Barbarian">S.O.B</abbr></li>
    <li><abbr title="Stormtroopers Of Death" class="AP-noPopup">S.O.D.</abbr></li>
</ul>

<ol class="AP-noPopup">
    <li><abbr title="Sabotage Organized Barbarian">S.O.B</abbr></li>
    <li><abbr title="Stormtroopers Of Death">S.O.D.</abbr></li>
</ol>
Copyright © 1998-2006 ALIMIKA SATOMI/NYAN-NYAN-HANTEN.