最初はまったく理解不能だったが、何とかデバッグが終わった。
以前からFirefoxだけ高さの座標がずれる現象がたまに起きていて気になっていた。
やっかいなのは再現するときとしないときがあるということ。
詳細を調べていくとわかった。
キャッシュが残っていると問題ない。
初回アクセスで画像の高さが取得できないらしい。
html側で画像のwidthとheightをしていてもだめ。
cssで高さを指定してもだめ。
cssで画像の「幅」まで指定すると初回アクセス時、画像の「高さ」がようやく認識できるみたい。
たかだか100px未満の画像だが8つも使いまわすと800pxもずれてしまう。
シングルページデザインで、今自分がどこにいるのか座標をみて制御するようなページだと、ページ下に行くほどずれが目立つ(ページ上部ではズレが小さいので気づかない)。
以上はIE, Chrome, Safariではまったく起きなかった。
Mac, WinのFFでのみ起きる現象っぽい。
iOSは無視するとして、AndroidのFFは大丈夫なのか?
後でチェックしよう。