[javascript] event target , scroll event 질문
조회수 868회
안녕하세요.
제가 img 태그에 스크롤이 됬는지 확인하는 코드를 작성하였는데 img 태그는 scroll 이벤트를 감지하지 못하더라구요.
const imgs = document.querySelectorAll('img');
imgs.forEach(img => img.addEventListener('scroll',isclicked));
function isclicked(){
console.log('image is clikced!');
}
scroll 이벤트는 window화면만 감지할것같기는 한데 ... 다른 객체도 scroll 이벤트를 감지 할 수 있을까 궁금해졌습니다.
질문1 이벤트의 대상을 어떻게 알 수 있나요? 이벤트의 대상을 target 이라고 부르나요? html element 인가요?
일단 그래서 mdn을 찾아보았습니다. https://developer.mozilla.org/en-US/docs/Web/Events/scroll
Target : DefaultView, Document, Element
mdn을 찾아보았는데 제 생각에는 target 이 이벤트의 대상을 지칭하는것같더군요. element 가 target 이라면 img태그도 scroll의 대상이 될 수 있을것같은데...
질문 2 img 태그는 scroll 이벤트를 감지 하나요?
왜 위의 코드는 작동하지 않을까요?
질문읽어주셔서 감사합니다!
-
(•́ ✖ •̀)
알 수 없는 사용자
1 답변
-
안녕하세요!
wheel 을 이용하시면, img 태그도 이벤트 대상이 될수도 있습니다 .
//HTML <img id="myItem" src="..." /> //JS let myitem = document.getElementById("myItem"); myitem.addEventListener("wheel", Handler); function Handler(e) { console.log('Hello') }수고하세요.
- 수정: mousewheel이 deprecated되어서 그냥 wheel로 수정했습니다
- 답변해주셔서 감사합니다. 근데 제가 궁금한건 mdn 에 scroll 이벤트의 타겟이 element 라고 되어있는데 왜 scroll이 img 태그에 스크롤을 감지하지 못하는지여서요 ㅎㅎ 이상하게 어떤 이벤트는 감지를 하고, 어떤 이벤트는 감지를 못하는게 있나봐요... mousewheel로는 감지를 한다고 하니 신기하네요 ㅎㅎ 알 수 없는 사용자 2019.3.8 20:35
- 와.. 질문을 제대로 이해하고 나니깐 저도 정말 궁금하네요.. 최진우 2019.3.8 21:16
- 앗 ... ㅎㅎ... 감사합니다.. 제가 궁금하게 만들어드렸군요!! 알 수 없는 사용자 2019.3.8 22:42
댓글 입력