CloseTag | الشروحات | Java Script | أحداث mouse في لغة جافا سكريبت | JavaScript Mouse Events

<!DOCTYPE html>
<html>
<head>
<style>
ul
{
  border:0.1px solid black;
  list-style:none;
  padding:0;
  margin:0;
  display:none;
}
li
{
  border:0.1px solid black;
  padding:5px;
}
 .btn
 {
   padding:10px;
   background-color:#007bff;
   border:none;
   color:white;
 }
</style>
</head>
<body>
<h1>JavaScript on mouse leave</h1>
<p id="paragraph">this text will be hidden after mouse enter</p>
<button class="btn" id="btn">Enter mouse pointer</button>
<script>
let paragraph = document.getElementById('paragraph');
let btn = document.getElementById('btn');
btn.onmouseleave = function(){
  paragraph.style.visibility = "hidden";
}
</script>
</body>
</html>

 
<!DOCTYPE html>
<html>
<head>
<style>
ul
{
  border:0.1px solid black;
  list-style:none;
  padding:0;
  margin:0;
  display:none;
}
li
{
  border:0.1px solid black;
  padding:5px;
}
 .btn
 {
   padding:10px;
   background-color:#007bff;
   border:none;
   color:white;
 }
</style>
</head>
<body>
<h1>JavaScript on mouse leave</h1>
<p id="paragraph">this text will be hidden after mouse enter</p>
<button class="btn" id="btn">Enter mouse pointer</button>
<script>
let paragraph = document.getElementById('paragraph');
let btn = document.getElementById('btn');
btn.onmouseleave = function(){
  paragraph.style.visibility = "hidden";
}
</script>
</body>
</html>