코딩하는라민

Jquery mouseover, mouseleave VS hover 차이점 본문

Core/Jquery

Jquery mouseover, mouseleave VS hover 차이점

코딩하는라민 2022. 9. 21. 08:00
728x90
반응형

Jquery mouseover, mouseleave VS hover 차이점

 

 

1. mouseover, mouseleave

- 자식 요소에도 영향(자식 요소에도 마우스 포인터가 올라가면 이벤트 동일하게 발생)

<script>
	$(document).ready(function(){		
		$('#quickmenu li').mouseover(function(){
			A
		});
		
		$('#quickmenu li').mouseleave(function(){
			B
		});			
	});
</script>

 

2. mouseenter

- 자신에게만 마우스 포인터가 올라갈 경우만 이벤트 발생

 

3. hover

- mouseenter 되었을 때, , mouseleave 되었을 때 이벤트를 각각 지정해줄 수 있음(연결해줌) 

- 조건문처럼 콤마로 구분한다.

- 마우스 오버되면 슬라이드 다운, 아니면 슬라이드 업

<script>
	$(document).ready(function(){			
		$('#quickmenu li').hover(function(){
			A			
		}, function(){
			B
		});			
	});
</script>

 

 

 

 

 

728x90
반응형