2012-03-03 100 views
0

在以下例子中的顏色,鼠標懸停在每個鏈路改變圖像:使用:懸停以改變圖像

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

訣竅是下面的代碼行:

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

a:懸停選擇器將背景設置爲sprite.png的綠色部分。

我可以用a:visited做同樣的事嗎?用戶點擊它後,圖標變綠了嗎?

我改了一個:懸停到:訪問並沒有任何反應。

+2

的'一個:visited'是當頁面由用戶,用戶'一個被訪問:active'到當用戶點擊它時更改圖像。 – 2012-03-03 05:53:16

+1

寫一個:主動,而不是:訪問檢查這個http://jsfiddle.net/3rj8g/ – sandeep 2012-03-03 05:56:52

+0

看到joelin.org/sprite.html,我試過這個想法,但點擊它們後,圖標沒有突出顯示。 – Joe 2012-03-03 06:37:41

回答

3

:visited造型目前僅限於預防與暴露用戶的瀏覽歷史記錄的安全隱患:

https://developer.mozilla.org/En/CSS/%3Avisited

開始在Firefox 4 ,主要限制到你可以使用這個選擇器的樣式 已被引入。有關 侷限性和動機的更多信息,請參閱Privacy and the :visited selector。 相同的侷限性已通過其他瀏覽器,包括 的Safari 5/4.1和Chrome 6.

0

你絕對可以。當然,:visited狀態只有在下一次加載頁面時纔可見。瀏覽器能夠確定是否以前通過標題信息訪問過一個頁面。

以下是一個演示正確的聲明順序有幫助的註釋的jsfiddle:

+0

它似乎沒有工作,在http://joelin.org/sprite.html我有'#home a:hover'後跟'#home a:active',最後'#home a:visited'。查看源代碼並單擊css文件。 – Joe 2012-03-03 06:37:18

+0

我現在可以說的最好的是,當我點擊其中一個鏈接(鏈接指向同一頁面)時,訪問狀態不會被傳遞到頁面中...也許它被緩存? – Joe 2012-03-03 07:25:11