jQuery mouseover和mouseout事件

當使用者將滑鼠指標移到某個元素上時，就會觸發 mouseover 事件。當使用者將滑鼠指標移出某個元素時，就會觸發 mouseout 事件。mouseover 和 mouseout 平常都是形影不離的。

mouseover 和 mouseout 分別用於控制滑鼠指標“移入”和“移出”這兩種狀態。例如，在下拉式選單導航中，滑鼠指標移入會顯示二級導航，滑鼠指標移出則會收起二級導航。

舉例：移入和移出

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="js/jquery-1.12.4.min.js"></script>
    <script>
        $(function () {
            $("div").mouseover(function(){
                $(this).css("color", "red");
            })
            $("div").mouseout(function () {
                $(this).css("color", "black");
            })
        })
    </script>
</head>
<body>
    <div>C語言中文網</div>
</body>
</html>

預覽效果如圖 1 所示。

圖 1：滑鼠指標移入和移出