JQuery - 마우스이벤트(mouseover(), mouseenter())

| 마우스 이벤트

HTML

 <div class="box1">마우스오버</div>
    <div class="box2">마우스엔터</div>
    <div class="result"></div>

CSS

 div {
        margin: 20px;
        padding: 40px;
        background-color: lightgray;
      }

JS

<script>
      $(document).ready(function () {
        $(".box1").mouseover(function () {
          $(".result").append("<Strong>마우스오버</Strong>"); //해당 영역에 마우스가 올라가면
        });
        $(".box2").mouseenter(function () {
          $(".result").append("<em>마우스엔터</em>"); //해당 영역에 들어가면
        });
      });
    </script>

---

$("요소").mouseover() : 요소위에 마우스가 올라갔을 때

$("요소").mouseenter() : 요소 영역안에 마우스가 올라갔을 때

$("요소1").append("요소2") : 요소1안에 요소2 삽입

결과 영상 확인 : https://blog.naver.com/jun950617/222832236294