목차
- onwheel 예제 - 마우스휠/터치패드 움직일 때 실행
- onwheel 정의
- onwheel 구문
onwheel 예제 - 마우스휠/터치패드 움직일 때 실행
<style>
#hz {
border: 1px solid black;
padding:10px;
}
</style>
<div id="hz" onwheel="homzzang()"><li>홈짱닷컴 Homzzang<li>홈페이지 제작관리 강의<li>그누보드 기초강의</div>
<script>
function homzzang() {
document.getElementById("hz").style.fontSize = "25px";
}
</script>
결과보기
onwheel 정의
(마우스/터치패드) 등의 휠이 위/아래로 움직일 때 실행할 코드 지정.
1. onwheel 속성 사용 가능 태그 종류
모든 가시 HTML 요소
2.
onmousewheel 속성이 폐기예고(Deprecated) 됨. 대신 onwheel 속성 사용.
3.
모든 브라우저 지원.
onwheel 구문
HTML 방식
- <element onwheel="myScript">
JS 방식 (3가지)
- object.onwheel = ()=>{myScript};
- object.onwheel = function(){myScript};
- object.addEventListener("wheel", myScript);
[속성값]
myScript
휠이 위/아래로 움직일 때, 실행할 JS 코드
- 주의: 함수명 사용 시, 다른 곳은 전부 소괄호까지 사용해 함수 호출하나 핑크색 myScript 자리는 "함수명만" 사용해 함수 호출.
- 사용 방식 통일 권장.
