れぶろぐ

2009-01-14 (水)

■ Whatever:hover の :focus 擬似クラスへの対応について

書くのを忘れていましたが、 Whatever:hover (通称 csshover.htc) のバージョン 3 がリリースされています。変更点はこんな感じです。

Ajax で読み込んだソースにも対応
onmouseover, onmouseout の代わりに onmouseenter, onmouseleave を使用 (参考: onmouseout IE flickering problem)
ソースコードの整理

ただし、バージョン 2.02 と比較すると、IE6 で :focus が機能しなくなっています。ちなみに csshover2.htc の場合は、IE7 で :focus が機能しないので、

csshover3.htc → IE6 で :focus が効かない
csshover2.htc → IE7 で :focus が効かない

という悩ましいことになっています。

私は IE7 でも :focus が機能する csshover2.htc の改造版を使っているので、それをそのまま使い続けてもいいかなという感じなのですが、もし真面目に対応しようとするのなら、

IE7 以降では、csshover3.htc を使う
IE6 以下では、csshover2.htc を使う

という動作にするのがいいかもしれません。そのためには、例えば、

<head>
	......

<!--[if IE]>
	<link rel="stylesheet" type="text/css" href="/css/ie.css" />
<![endif]-->
<!--[if lte IE 6]>
	<link rel="stylesheet" type="text/css" href="/css/ie6.css" />
<![endif]-->

</head>

のように場合分けしておいて、

ie.css

body {
	behavior: url(/js/csshover3.htc);
}

ie6.css

body {
	behavior: url(/js/csshover2.htc);
}

のようにすると、希望の動作にすることができます。

Tags: JavaScript |

| Permalink

[コメントを書く]

コメントがあればどうぞ! E-mailアドレスは公開されません。

本日のリンク元

編集


		2009年 1月
日	月	火	水	木	金	土
				1	2	3
4	5	6	7	8	9	10
11	12	13	14	15	16	17
18	19	20	21	22	23	24
25	26	27	28	29	30	31

2009-01-14 (水)

■ Whatever:hover の :focus 擬似クラスへの対応について

カレンダー

過去の日記

ブログ内検索

タグクラウド

最近の記事