한 파일에 여러 이미지를 추가 후, 각각의 이미지를 불러다 사용하는 법?
본문
한 파일에 여러 이미지를 추가 후, 각각의 이미지를 불러다 사용하는 법?
네이버나 다음 소스를 분석하다 보니까, 한 이미지에 여러 이미지를 그려넣고
필요한 곳에서 그 이미지의 특정 부분만을 불러다 사용하더라구요..
http://i1.daumcdn.net/svc/image/U03/common_icon/5265025001055B0001
이런 거 어떻게 하나요?
답변 1
스프라이트 이미지라고 검색해 보시면 됩니다.
css로는 보통 마우스 올렸을 때 해당 이미지의 x, y 좌표를 찍어 줍니다.
이미지맵은 보통 네모로 그렸을 때
1 2
3 4
라고 했을 때
1의 x, y
4의 x, y
를 갖고 오는데
스프라이트 이미지의 경우는 1의 x, y만 갖고 와서 보여줄 이미지의 width, height를 지정합니다.
직접 몇 개 테스트 해 보시면 쉽게 이해가 갈 겁니다.
답변을 작성하시기 전에 로그인 해주세요.