あー。また、IE6のアレだ
腐れIEだ。
zoom:1
とか。
<!--[if IE 6]>
<link rel="stylesheet" href="./css/ie6.css" type="text/css" media="screen,projection,print" />
<![endif]-->
とっとと退場しくされ。
なんとか今月末にはリニューアルしようと思って、バグ取りやってんのに、こんなどーでもいいところに割く時間とか労力とか1ミリもねえぞ。ちくそお。
MSの生産物にはうんざりさせられることばかり、だ。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
問題の切り分け
昨日は一日悶絶。朝から頭痛、眼痛、吐き気で、トイレと布団の往復。吐きまくりの青息吐息だった。
いや、たしかに、金曜の夜はワインを一本空けてるけど、ワイン一本ぐらいでこんな目にあったことはない。なんか寒気もするなあ、と思って熱を計ったら37度。でも、37度ぐらいでこんな目にあったことはない。
どっちがどっちなんだか問題の切り分けができん、と、朦朧とした頭で考えつつ、風邪でちょっと弱ってるところにワイン一本流し込んだ相乗効果。ビジネス用語でシナジー効果というやつだろうと、くそったれ。
抜けるような青空だったのに(かんべむさしの短編のラストに、青空にむかっておちてくサラリーマン、てのがあったなあ)本当にもったいない。
天気予報どおり、案の定、多少マシになった今日はどんより曇り空。ついてないなあ。どうせ今日もまだ軽く寒気することだし、部屋で転がるしかないんだけど。
おとなしくスクリプトでもいじって過ごすか。
ありがちなタブもどきメニュー。
やりかたはいろいろあって。スタイルシートだけでpositionとz-indexを使ってやったり、背景画像を利用したり。
このスクリーンショットは画像利用のパターン。
外枠の中に3つのタブ、という構成で、一番外枠の背景に高さ1ピクセルの罫線用の画像を用意(幅はなんでもいい)
background:url("keisen.jpg") left bottom repeat-x
するだけ。あとはハイライトしているタブのborder-bottomを背景色にして、外枠の罫線を殺す、という仕掛けだ。
スタイルシートが簡単なので、ブラウザ間の差もなさそうだし、これでやってみることにした。
ちょっと検索するだけでいろんな種類が出てくる。タブ形式のメニューって流行りだったんだなあ。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
めも
メモ。
あやしいところは。
clear:bothしてみる。親もfloatしてみる。float:noneしてみる。
IE6用には _width _marginなどアンダースコアプロパティ
FireFoxなどには :root疑似クラス(?)
を使って後で指定。(ネットショップで一日120万PVのアクセスログを見る限り、IEの圧勝)
inline-blockは確かに便利だけどfirefoxは対応していないので使わないでくれ。ブロック要素をいじるんでhtmlの方を書き換えることになっておおごと。
input passwordフォームの黒丸。IEだとMSゴシックなど日本語フォントの指定が原因で「黒丸」が大きい。半角に合わせるにはそこだけfont-familyをarialなど欧文フォントだけ指定。でもってそこにpadding:0なんてのを指定するとIE6だと黒丸が欠けてパックマンになるんで、_paddingを少しだけ。なんだかなあ。
同じく input textエリア。カーソルの高さとフォームの高さが合ってなかったり、カーソル点滅後微妙に上とか下にずれる時。フォントと行間などがうまく合ってない。とりあえずline-heightの指定を1emにすれば妙な挙動はなくなる。(100%とかpx指定だとカーソルが動く)
IE6は、センタリングのためのmargin autoをうまく解釈してくれないことが。親にtext-align:centerを。
IE6でdiv要素の最後の文字などがヨコチン状態になることがある。paddingを0pxに指定してると起こりやすいので_paddingで適当に(検索すると3pxという事だけど、1pxでもハミチンの収まったところもあった、かな)ていうかIE6でpadding:0は危険。
negative marginがごちゃっとあると、FireFoxでは、下のレイヤーの見えているリンクがクリックできなくなったりする。用もないのにネガティブマージンは使わない。
border:1px red solid をエディタに登録しておいてワンキーで埋め込めるようにしておくと便利。
てのが仕事絡みのリニューアルメモ。
「ブラウザ」の「戻る」挙動にハマった。
IE7。
ログインページでID、パスワードを入れてエンター。LocationでHOMEに飛ぶ。工事中のHOMEにはリンク先のない空リンクがたくさん。ある。それを適当にたたくとページが遷移してHOMEが再び。そこで「戻る」と、なんとログインページで入力した内容がHOMEのinput textに出るじゃありませんか。よりによってログインIDだ。こんなものが現れたら腰がぬける。キャッシュがいけないのか、Locationで飛ばすのがいけないのか、それともJavaScriptがなにかやってるのか、で悶絶。
ところがFireFoxだとこんなことは起きない。「戻る」とログインページに、意図したとおり戻ってくれる。
ぐぐるための単語すら思いつかず…。あれこれ試してみたところ、a hrefが空のリンクの時にだけ起こることが判明。ページが完成したら、リンクが空、なんてことはありえないのでほっと一息。
しかし、IEはなんでまた違うページのフォームのデータを余計なところに出すんだろう。空のリンクを踏んだ時の挙動が変なのかな。
てのが読書SNSリニューアルのネタ。
今回は表示回りの部品を先に作ったので、スクリプトを書きながらスタイルシートも一緒に考える必要がないのでそっちはラク、かも。
うちの王様は点滴から投薬に切り替え、自宅療養。
そういや、古処誠二「敵影」が直木賞候補になってたのか。うーん、残念。
都心は底冷え…
[15:01:48]
ありゃ。rssが変だった。
- 『おかえりください』サウンドノベルWINDOWS版
- 『おかえりください』本編を加筆修正、6つのバッドエンド分岐シナリオを追加してサウンドノベル化!
音と映像が、血まみれのこっくりさんの惨劇を蘇らせる。 - 【無料体験版】はこちら
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
やっとOKかも。
犯人を追いこみ中だ。
だいたいリニューアルするってのに、リニューアル前よりレスポンスが悪くなる、なんてのは「ありえない」。
レイアウトデザインは今度のほうがかなりいい。テーブルレイアウトを使ったのはごくわずかで、ページの変更・更新もラクにできる、はず。
ところが、レスポンスがどうにもダメ。
Extended Statusbar
Load Time Analyzer
ここんとこずっと、FireFoxに入れた上記ふたつのアドオンを睨みっぱなし。同じデータを扱ったページで比較すると、旧サイトが1秒ほどなのに今度のサイトは2秒が切れない。ぶっちゃけ、旧サイトはテーブルで囲って、ピクセル単位でそろえるためだろう、なんのこっちゃな意味なしテーブルだらけ。そんな旧態依然のサイトの方が早いのだ。もう愕然というか茫然自失。
cssを疑いJavaScriptを疑い、ひとつ削ってはアドオンの数字をチェック、という地引網ちからワザ作業を延々と続ける。で、今日ようやくどうにか2秒を切った。これで旧サイト同様「早いサイト」だ。ほかのパソコンで検証しないといけないけど、ほぼOK、かな。最大の原因と思われるのはJavaScript。たぶんdocument.writeのコストが高い。htmlを書き換えるんだから、細かくdocument.writeの数が多いとそれだけで表示が重たくなる…のかなぁ。
少しほっとしたぜ、ちくそお。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
Sleipnirがいいです
ブラウザもいろいろで、
IE、FireFoxを基本として、OperaとかSafariとか、Netscape、Lunascape、Sleipnir
を使っていて、ここんとこずっとIE7がメインだったんだけど、Sleipnirがいい。HawkEyeというプラグインを入れると、直接編集こそできないものの、これはほとんどDreamweaver。罫線でかこってclass名がわかったりCSSをひっぺがしたり。IEとGekkoを同時に見ることができたり。
これがあればいろいろずいぶんラクになる。
てことで、メインはSleipnirに乗り換え。
ホームページを作ってるひとには絶対のオススメプラグイン+ブラウザ、かも。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
日差しが心地よい休日
天気がよくて爽やかな一日、街を歩く人たちは笑顔だ…なんで会社で仕事してんだ、おれ(苦笑)
昨日インストールしたLynxだけど、この雑記帖に書き込みができずあれこれと検索。
「Lynx は MIME ヘッダとターミネータを持つマルチパートセクションとして符号化された name=value ペアをもつフォームの内容を送信するための ENCTYPE="multipart/form-data" をまだサポートしません。FORM タグがこの ENCTYPE を指示するなら,Lynx はフォームフィールドを整形して表示しますが,それらを DISABLED 属性を持つものとして扱うので,不適切な符号化で送信することはできません。」
てコトらしい。うー。画像をアップロードするために multipart を使うしかなかったのが敗因だったか。とりあえず、HTTP_USER_AGENT を見て Lynx だったら、ごにょごにょ変更するしかないのかなぁ。いかにもやっつけのつぎはぎ。
うーむ。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」