chromeの不具合

jQueryで、イメージスライダーを実装した際、Chromeで二つの不具合が発生。けっこうレアなバグだと思うのでメモメモ。

使用したプラグインは、「jquery.bxslider」。

 

◆その1 画像ズレ Chrome全般

後続の要素の画像が、スライダーが動くたびに1pxほどずれては戻り、ずれては戻り。

センタリングしているものがズレているのは分かったが、他の画像は物によって症状が出ない。

原因は、ズレる画像の親要素の幅が奇数pxだったこと。偶数ピクセルにすると症状が出なくなった。

 

◆その2 テキスト色が薄くなる Mac Chrome & Mac safari

後続の要素のテキストが、スライダーの動きにつられて薄くなっては戻り、薄くなっては戻る。

症状の出ない箇所を参考に調べたところ、背景色がついてない場合に症状が出ることがわかった。

すべての要素に背景色を付与して症状が出なくなった。

アーカイブ

ウェブページ

「紺屋の白袴」とはまさにこの事。見にくいしスマホ対応もまだしていません。そのうちやります。そのうちにね。

エフスタジオの中の人は株式会社メキメキに在籍しています。