沒有圖像變化的滾動

Question

我有一個小的縮略圖圖像，當鼠標滾過它時，我希望改變它。我想知道是否有辦法做到這一點，而不用交換翻轉圖像。例如，通過CSS，我可以在翻滾時進行不透明度更改嗎？如果您有任何關於如何使用CSS在滾動中操作圖像以進行更改的其他想法，我已打開。

Thanx！

Answer 1

嘗試在標籤上使用:hover樣式。在IE早期版本中可能不會得到很好的支持。但你可以這樣做：

img { 
    border: 1px solid black; 
} 
img:hover { 
    border: 1px solid white; 
} 

Answer 2

在CSS3中，有一個不透明選項。這樣，當他們懸停在某物上方時，您不會被迫重新加載圖像。

#div { 
    background-image: url('blah.png'); 
} 

#div:hover { 
    opacity: 0.5; 
} 

我不完全相信，如果這是正確的方式來使用它，所以你應該使用谷歌更多的例子。但是，您應該小心，因爲並非所有瀏覽器都可能支持CSS3。

Answer 3

您可以將兩個圖像放在一個更大的圖像中，將其用作背景圖像並僅更改翻轉時的位置。