jQuery mouseleave() work with mouse out event

Description

jQuery mouseleave() work with mouse out event

View in separate window 

<!DOCTYPE html>
<html>
<head>
<script 
 src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
</script>// www  .ja v  a2  s.c  o m
<script>
x = 0;
y = 0;
$(document).ready(function(){
  $("div.over").mouseout(function(){
    $(".over span").text(x += 1);
  });
  $("div.enter").mouseleave(function(){
    $(".enter span").text(y += 1);
  });
});
</script>
</head>
<body>

<div class="over" 
     style="background-color:lightgray;padding:20px;width:250px;float:left">
  <div style="background-color:white;">Mouseout event triggered: 
    <span></span></div>
</div>

<div class="enter" 
     style="background-color:lightgray;padding:20px;width:250px;float:right">
  <div style="background-color:white;">Mouseleave event triggered: 
     <span></span></div>
</div>

</body>
</html>



PreviousNext

Related