使用a：hover更改圖像的顏色

Question

在以下示例中，將鼠標懸停在每個鏈接上會更改圖像：

http://www.prism.gatech.edu/~dm257/sprite.html

技巧是下面的代碼行：

#home a:hover {
  background: transparent url('sprite.png') 0px -37px no-repeat;
}

a：hover選擇器將背景設置為sprite.png的綠色部分。

我可以對a：visited做同樣的事情嗎？ 用戶單擊后使圖標變為綠色嗎？

我將a：hover更改為a：visited，但沒有任何反應。

Answer 1

當前限制:visited樣式，以防止與暴露用戶瀏覽歷史相關的安全風險：

https://developer.mozilla.org/En/CSS/%3已訪問 ：

從Firefox 4開始，已經引入了使用此選擇器可以應用的樣式的主要限制。 有關限制及其動機的更多信息，請參見隱私和：visited選擇器 。 Safari 5 / 4.1和Chrome 6等其他瀏覽器也采用了相同的限制。

Answer 2

你絕對可以。 當然， :visited狀態僅在下一次加載頁面時可見。 瀏覽器能夠通過頁眉信息確定先前是否已訪問過頁面。

這是一個jsFiddle，它通過有用的注釋來演示正確的聲明順序：

• http://jsfiddle.net/fmYdD/4/

Answer 3

您可以借助此插件來完成- 訪問鏈接插件

下載JS： jQuery.visited.js

請參閱以下與之相關的lins：

• 使用javascript或jquery設置訪問樣式
• 從JavaScript設置CSS偽類規則