이미지가 변경되지 않는 롤오버

Question

마우스를 가져 가면 변경할 작은 축소판 이미지가 있습니다. 롤오버에서 이미지를 교체하지 않고이 작업을 수행 할 수있는 방법이 있는지 궁금합니다. 예를 들어 CSS를 통해 롤오버에서 불투명도를 변경할 수 있습니까? 변경을 위해 롤오버에서 CSS로 이미지를 조작하는 방법에 대한 다른 아이디어가 있으면 열려 있습니다.

고맙습니다.

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; 
} 

올바른 사용법인지 잘 모르겠습니다. 더 많은 예제를 보려면 google을 사용해야합니다. 그러나 모든 브라우저가 아직 CSS3을 지원하지 않을 수 있으므로주의해야합니다.

Answer 3

당신은 배경 이미지로 사용하고 롤 오버 만 위치를 변경, 하나 개의 큰 이미지에서 두 이미지를 넣을 수 있습니다.