이 코드는 두 개의 링크 된 영역 (호버링하기위한 것임)을 만들고 페이지의 상단 50px, 그 다음 하단 50px에 만듭니다. 따라서 마우스를 세로로 움직이면 두 호버를 치고 img
은 옆으로 이동합니다.스프 라이트에서 호버 영역을 만드는 방법?
<html>
<head>
<style type="text/css">
a {display:block; left:0; height:50px; width:300px;}
a#a1{top:50;}
a#a2{top:100;}
a img {position: absolute; top:0; left:0; width:300px;}
a#a1 img:hover {left: 50px;}
a#a2 img:hover {left: 100px;}
</style>
</head>
<body>
<a id="a1" /><a id="a2" /><img src="smiley.gif" />
</body>
</html>
배경 이미지 또는 이미지 맵을 다시 배치하여이 작업을 수행하는 것이 좋습니다.
내 링크가 이미지의 부분 이상에서만 발생하도록 링크 (img
포함)의 크기를 다시 조정하려면 어떻게해야합니까?
가깝습니까? http://jsfiddle.net/thirtydot/FdxZ5/ 나는 당신이 원하는 것을 이해하지 못한다. 그래서 나는 추측했다. – thirtydot