[CSS]一枚の画像に複数のリンクを設定する -Image Browser Controls

一枚の画像に複数のリンクを設定する場合、その画像をリンクごとに切ったり、クリッカブルマップやスクリプトを使用しないで、CSSで設定する方法の紹介です。

Image Browser Controls

ロジックは、テキストリンクを設置し、それに背景画像とマイナスポジションを指定し、元の画像に重ねます。
透明度を指定し、hover時にその背景画像が見えるように透明度を変更し、上記キャプチャ画像のように矢印が重ねています。