IE7 でチェックしてみたらいきなりレンダリングがページ途中でストップ。その上 CPU リソースを喰い潰し、100% になったまま。これはどう考えてもバグだろ、と検索かけてみたところ、最速インターフェース研究会の記事にある現象とかなり似ていることが判明。以下に列挙したのは、ウチで再現したパターン。
position : absolute or relative or fixed であるoverflow : scroll or auto な要素次の XHTML 文書断片を考える。
<!-- 前略 --> <div id="header"> <h1>タイトル</h1> </div> <div id="body"> <!-- 中略 --> </div> <div id="footer"> <!-- 中略 --> </div> <!-- 後略 -->
前述の XHTML 文書断片に、次の CSS 断片が適用されていた。
#body
{
position : absolute;
top : 10%;
width : 100%;
height : 80%;
overflow : auto;
}
で、#body に格納されている内容が長大だと現象が発現したわけだ。
これは解決しないとマズい問題だ。そこで色々考えてみた。
position : fixed による #header 並びに #footer の配置を行い、#body を static なままとする方法はどうだろう。だがこの方法は以前採用し、ボツにした経緯がある。理由は次の2つだ。
margin に % 値を指定しても、それは包含ブロックの横幅に対する % 値になってしまうため1番目の問題も深刻だが、何より2番目の問題が大きい。上下には #header と #footer が height : 10% ずつ領域を占めている。ここに #body の内容をカブらせたくないのだ。em 単位は全体のバランス（特にウィンドウサイズ変更時）がとれなくなるため利用したくない。
さてどうしようかと悩んだが、ふと思いついた。そもそもポジショニングする必要があるのだろうか？ と。
結論から言えば、全くないのだ。わざわざ #head, #body, #foot を位置指定しなくとも、static のままのフローでよいのだ。きちんと % 値指定をしてやればよいだけだった。あとは #body に overflow : auto を指定すればよい。IE7 のバグは static な要素では発現しないため、バグ回避は成されることになる。
実験の結果は見事成功。以前と同様のスタイルになっている上、IE7 でも正常にレンダリングされる。あとは包含ブロックが body 要素になったため、絶対配置の要素たちに与えてある位置情報を書きかえてやるだけ。あまり手間はかからなかった。
めでたしめでたし。
実は前述の変更により、Opera 9.24 でスクロールするとナビゲーションの背景が一部欠けてしまう問題が発現するようになった。9.50 Beta 1 では発生しないため放置しようかとも考えたが、やはり気持ち悪いので何とかしたい。
表題の通り、Mozilla Firefox 3.0 の Beta 1 がリリースされた。一般ユーザ向けではないのはいつもの通り。早速インストールしておく。Places の関係でブックマーク絡みの拡張が使えないため、まだ常用移行はしない。
Apple Safari 3 の Mac OS X 版（並びに Windows ベータ版）リリースもそうだが、最近 UA 絡みのリリースが頻繁でとてもよい。
さて、スタイル微調整の続きでもやるか……と思ったが、あまり調子がよろしくないため早めに寝よう。
ようやく IE 対応も終わったのでお披露目。ひとまず IE 以外の UA なら適用されるようにしてある[1]。テキストズームをグリグリとやってみてもらえれば、どんな感じなのかはわかると思う。画像 Off にしてもテキストは残るため、最低限のアクセシビリティは確保されている。
次に列挙したのは、正常動作を確認した UA。
で、よく見ている人なら気づいたかと思うが、リストに「Opera 9.50 Beta 1 (Build 9613)」（以後「Op 9.5b」）が存在していない。実は Op 9.5b で押し込み効果がうまく機能しないのだ。どうしてか作用しないのが li:active と li:active:after。この両者のスタイルが反映されない。
あくまでも推測でしかないが、イベント伝搬の実装が微妙に変わり、a 要素（のオブジェクト）にだけイベント通知が行なわれており、li 要素（のオブジェクト）まで伝搬していないのではないだろうか。これ、CSS 2.1 だと正常な動作なんだっけ……？ 確認してみよう。そんなアホな仕様はどこにもなかったような気がするので、まだベータ版でしかない Opera のお茶目なバグだと思うのだが。
ナビゲーション以外にも、色々と細かいところを改良してある。一部実装中の代物も転がっていたりするが、それはまあ御愛嬌ということで。
にしても、久しぶりにメジャーバージョンアップ[2]を施した。まだまだこのスタイルも現役……なのだろうか。そろそろ細かい部分から変えていってもよさそうなものだが。まあ時間と労力、あとやる気次第ってことか。
同時に script.aculo.us も 1.8.0 に。気づかなかった……。出たのは11月7日。1週間以上前なのか。とりあえずいぢってみよう。changelog には大量の変更点が列挙されているが、とりあえず what's new に列挙された API の追加分が参考になるだろう。
ああ……やることが多いなぁ。だが何もない状態はもっと嫌だ。まずは洗濯物をどうにかすることからはじめるか。折角いい天気が続いてるし。ちょと肌寒くなってきたけれども。
いつの間にか文庫化されてた。映画化にあわせてる感覚か。加筆訂正があるとのことなので購入。例えば、次のような相違があったりする。
……どのくらい経っただろう。気がつくと、私の横には黒桐がやってきていた。
「傘あるよ」
中国人みたいな発音だった。
「いいの、迎えが来るから。黒桐くんは早く帰りなさい」
『空の境界 上』ノベルス版 P62
……どのくらい経っただろう。気がつくと、私の横には黒桐の姿があった。
「傘あるよ」
「……いいの、迎えが来るから。黒桐くんは早く帰りなさい」
『空の境界 上』文庫版 P93
細かな言い回しの変更、中国人のくだりの削除が行なわれている。編集判断もあったのかもしれない。
解説が綾辻行人氏なのがまた……。しかし、ノベルス版では存在した笠井潔氏による（解説にしては）長大かつ有益な論考、『山人と偽史の想像力』、ないし『「リアル」の変容と境界の虚無化』は収録されていない。初めて読んだ時、本編と同じぐらい凄いと思った代物だったので、この点は少々残念。
これで『空の境界』はおおまかにわけて4つのバージョンがあることになった。はじめに Web 上に掲載していた版、次に同人版、そして講談社ノベルス、今回の文庫。残念ながら前者2バージョンは持っていない。同人版は友人が所有しているので読ませてもらったが（当時は仲間内で回し読みするほど人気だった気がする）。更に粒度を下げればもっと沢山のバージョンが世に出たことになる。
色々といじくりまわして、ようやくテキストをそのまま生かしたナビゲーションが完成した。但し、まだ IE 対策をしていないため公開はもう少し先。IE には、旧来のスタイル（画像置換）を適用させて対応させる。しかし……IE7 が未だに疑似要素（:before, :after）未サポートってのがねぇ。
利用できる UA は IE 以外の、所謂モダンブラウザと通称される者共。以下チェックした UA のリスト。全て Windows XP SP2 環境。
Mozilla Firefox は float ではなく display : table-cell を利用することで2系でも対応。結局使ってしまった table-cell。まあ仕方ないのだろうか。
押し込み効果もきちんとサポート。背景は以前の画像置換によるものと同様に、background-position 値変更で「押し込み後」の画像と入れ替えて実現。テキストは padding と margin の値をゴニョゴニョして対応。上・左から 2px ずつ押し込まれる感じを実現した。
テキストズームにも対応。大きくしてもレイアウト崩壊しない上、テキストが背景を飛び越すこともない（この状態を実現することが今回の試行錯誤の発端）。但し小さくするとある一定値を越えたところで背景位置がズレる。これはもう仕方ないかも。min-width と min-height を使えば何とかできそうな気もするが、色々とアレげなのでまだ未対応。
フルページズームさせても特に問題なし。Mozilla Firefox Nightly では 1px の不可思議なズレが出るものの、崩壊するには至っていない。これは原因究明中。
今回はネガティブマージンには大いに頑張ってもらった。その甲斐あってか、ナカナカの出来栄え。
また全ての領域に a 要素をオーバーラップさせ、「クリックできそうな部分すべてが a 要素の領域」であることを徹底させた。これがなければもう少し簡単にできたのだが……。もう個人的な趣味というか、執念というか。実現できたからいいけれども。
より詳細な技術的話題はまた時間があるときにでも書く予定。……その前に IE 用スタイルをどうにかせんとなぁ。公開もせんといかんし。
HTML のそれとは違うのであしからず。存在そのものは知っていたのだが。もうね、なんで今まで使ってこなかったのかと。こいつがあれば分割したウィンドウをそのまま保持しておけるから、作業スペースが欲しくなったら新規フレームを作成してしまえばいい。今まで4分割したウィンドウでゴニョゴニョしていたのが嘘みたいだ。
例えば、次のような使い方ができるだろう。
これらをコマンドで切り替えてやればいい。全部キーボードだけで完結。まさに理想。
因みに、利用する関数は次のとおり。括弧内はデフォルトのキーバインド。
other-pseudo-frame（C-x 6 o）previous-pseudo-frame（C-x 6 p）delete-pseudo-frame（C-x 6 0）new-pseudo-frame（C-x 6 2）ウィンドウ分割とほぼ同じ。違うのはプレフィクス。6 が必要なのだ。この 6 つき C-x は、セッションファイルのロード・セーブにも利用されている（C-x 6 f と C-x 6 s）。慣れれば特に問題なく押せる。
ごめんよフレーム。今まで超脇役だと思っていたよ。だが今日から主役。セッションにもきちんと保存されてくれるのもイイ。機能はちゃんと使ってやらんとなぁ。
IE は完全に除外して考えている。:before / :after 疑似要素使うからそれも当然か。基本は疑似要素の背景画像をうまく組みあわせて角丸とドロップシャドウを表現。画像置換は利用せず、テキストをそのまま生かす。文字拡大縮小に対応させて、かつ a 要素の選択範囲から他の要素をはみ出させないようにする。
制約条件があればあるほど実装が難しくなるが、だからこそ燃えるというか。気づいたら3時間ぐらい経過していた。あと少しで基礎はできそうなのだが、もう一歩が踏み出せない。display プロパティは block だけ、という縛りもやめた方がいいのかしらん？ table-cell 使っちゃうとか……。ううむ。それはそれで新たな問題点が出てきそうだ。
あと、もし公開するとしたら Mozilla Firefox 3.0 がリリースされてからかも。どうやら2系にはバグがあるらしく、テキストの拡大・縮小（フルページズームではない）しないと正常なレンダリングを行なわないようなのだ。今のところ回避策はない。Gran Paradiso Alpha 8 (Gecko/2007091216, rv:1.9a8)、Opera 9.24、Safari 3 (AppleWebKit/523.11.1+) では意図どおりのレンダリングを見せた。z-index、ポジショニング、ネガティブマージン、浮動要素、clearfix その他諸々のオンパレードなので、仕方ないといえばそうなるか。早く stable な Firefox 3 がリリースされて、普及してほしいなぁ。
三人三様の「想い」の交錯を導火線にして、シナリオはどんどん進んでいく。……というより、これぐらいしか書けることがない。キリスト教（カトリック）でいうところの三位一体を云々という話もできなくはないが、時間かかりすぎるので省略。ダウナーな感じは『スプライト』と同じなのだが、どちらかといえば『オイレン』の方が陽気さを全面に押し出しているといえる。ただその分、絶望が訪れたときは登場人物（キャラクター）のダメージが大きい。揺れ幅がデカいといってもいいだろう。
涼月の話、陽炎の話、夕霧の話と三話三章三短編構成（ホント3が好きだな）である。うち、夕霧の話が最もヘヴィになるよう設計されている。涼月の話もアレではあるのだが、きちんとオチがついているので導入部のツカミ用といっていい。
まあアレですわ。新作のゆりえ様フィギュアがね、予想外の突発というか。デキもいいし。買っちまいましたという。それが今日届いた。
やはり置き場所に困るなぁ、というのが正直なところ。ヴィネット風なので結構大きいのだ。だがやはり現物を見ても完成度が高い。つーか、もう、どっぷりと舛成アニメに平伏した身には過ぎたプレゼントみたいな。
しかし、何だってこの時期に出したのだろう？ アニメ放送は2005年。昔といってしまえばそれまでである。しかも時間は深夜。私は DVD で追いかけた。文化庁のメディア芸術祭で優秀賞とった代物ではあるが……。ともあれ、私にとっては好都合だったのは確かである。まあ、確かに私のような立場をターゲットにするならば、会社に就職して金を稼げるようになってから、しかも安定してから商品投入する戦略は合理的だと思う。標準価格は確か7329円。安いところでも6000円台。バイトしてるか、社会人になってでもいないと手がでない。
してやられたとはわかっているものの、欲しかったんだから仕方ない。
今月は冲方三昧である。なにしろ『スプライト』『オイレン』同時、さらに『ばいばい、アース』。しかし既に全部読んでしまったのが何ともはや……。いや、それなりに時間かかってるけれども。
『スプライト』も、どんどん鬱々展開が続いてゴキゲンな様子。やはり『マルドゥック・スクランブル』の延長線、もとい延長戦という見方は間違っていなかった。ああまであっさりとアレがそうなるとは思っていなかったが、次の巻でどうなることやら。
おまけでくっついてくるバカショートショートも必読。本編のダウナー度合い――登場する殆どの人間にある凄まじい焦げ付き――がもたらす人間模様を完全無視。アレだ、どっかのち○こいじり大好き漫画家のあとがきマンガというか、あんなノリ。『学園キノ』といい、セルフパロディが再び流行りだしたのか……？
そして早速やってみた。64持っていて「スーパーマリオ64」をやったことのある身としては、当時を思い出しながらのプレイ。それにしてもこれは……。小惑星にあるまじき重力だな。カメラ位置を動かせるパターンが少なすぎるのが少々ネックだが、個人的にはあのグルグル感が気持ちいい。「マリオ64」より遥かに 3D 酔いしやすいカメラワークと空間表現だが、とりあえず色々な意味で鈍いらしく、私は全く酔わない（乗り物含め）ので問題なし。3D やら何やらで酔う、という感覚がわからないのだ……。酒はあまり強くないんだが（違
「場外に落下する」、という概念が殆どない（小惑星の中心に落ちることはある）為、重力がなさそうなところにもガシガシ行けてしまったりする。何つーか、キモいんだけれども妙な背徳感があって爽快でもある。
個人的にはパンチ、キック、ヘッドスライディングなどの動作がとれないことに軽く驚いたが、不必要と判断されたのだろう。他の動作は大体「マリオ64」を踏襲している。それだけ完成度が高かったということなのか。ステージが小惑星だった場合、走り幅跳びがまったくその威力を発揮しない（高速移動ではない……重力の関係）のは体感的にわかるが、いやはや。ついつい使ってしまって仕方ない。慣れないとな。
うーん。やはり私は箱庭が大好きのようだ。予算があれば「Halo 3」もやってみたいんだが……。どうしたもんか。
気づいたら、あっという間に読み終えていた。怒涛の展開。ふたつの問いとその答え。悟りを開いたモノが、そこに現れた。
残念ながら、私にはこの作品を十分に語れるだけの知識がない。完全に理解できたとも思わない。だが受け止めることはできた。あとは、私に与えられた時間を使えばいいだけの話である。
今まで「inline + background-image」で実装していたパンくずリストを、「float + content」で再実装中。一般的 UA 用の対応は既に完了している。あとは IE6, 7 用の対応を残すのみ。
Apple Safari が Windows でも動作するようになったのはかなり助かる。とりあえず最新の Nightly (AppleWebKit/523.11.1+) をぶち込んで確認してみたが、とりたてておかしな所はなかった。
ナビゲーション用リンクリストのスタイルも、background-image から content に変更してみたりしている。IE6, 7 にはもちろん別対応が必要だ。
とりあえずちまちまといじってみよう。
エンタテインメントなんだなぁ、と感慨深くなる一冊。しっかり SF でありながら重厚なテーマ性を上っ面に被り、その下にあるのは味つけを薄めにした芯。すごく好き嫌いがハッキリと別れそうな代物だ。まだ半分しか読んでいないが、まあアレだ、文体が云々なんて野暮なことはいわないほうがいいと。せっかくの読者サービスなのだ。しっかり享受するべきである。
仏教の生み出した概念が全面に出てくるが、まだ物語と本格的に絡むところまできていない。これからなのか。また一体どんな状況になるというのだ。
はやいとこ下巻も読もう。休日もきちんとあることだし。