after 疑似要素で CSS ロールオーバー – VERSIONFIVE以前、画像のCSSロールオーバーについてアクセシブルな方法はないかと考えてみたことがありました。あれから約2年、新しいサイトのHTML組んでたら、たまたま違う方法を見つけたので覚え書きしておきます。 ブラウザの対応は、おそらくafter疑似要素(contentプロパティ)に対応するブラウザなら表示されると思います。つまり、IE7以前はそもそもロールオーバーにならないってことです。まぁそこはこの際いいんです[1]。 今回も画像はCSS Nite LP3の課題のものを利用させていただいています。 使用した画像ファイル わかりやすいように2pxのボーダーと背景色を設定しています。 viewmore.gif HTMLで利用した画像です。 viewmore-hover-after.gif CSSのhover時に利用した画像です。「CSS ロールオーバーのアクセシビリティを少し考えてみた」の時とは違い
