JavaScript獲取鼠標(biāo)移入div方向的方法是什么

小編給大家分享一下JavaScript獲取鼠標(biāo)移入div方向的方法是什么，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！

前幾天看了百度圖片帶有的文字標(biāo)題，它會(huì)隨著鼠標(biāo)的移動(dòng)方向載入，覺得蠻有意思，于是就想實(shí)現(xiàn)這么個(gè)功能。經(jīng)過一番搜索和查找，找了兩種實(shí)現(xiàn)方法。

方法一：用四個(gè)div拼成一個(gè)區(qū)域，從哪個(gè)div移入，就是從哪個(gè)方向移入。

方法二：獲取鼠標(biāo)移入的那個(gè)點(diǎn)，距離div的左右上下哪條邊最近，最近的那條邊就是鼠標(biāo)移入的方向。

針對(duì)方法二，自己寫了個(gè)小方法，代碼如下，僅供參考

function getDirection(ev) {
            var mx = ev.clientX,
                    my = ev.clientY;
            var el = this.offsetLeft,
                    et = this.offsetTop,
                    ew = this.clientWidth,
                    eh = this.clientHeight;
            var left = mx - el,
                    right = el + ew - mx,
                    top = my - et,
                    bottom = et + eh - my;
            var min = Math.min.apply(Math, [left, right, top, bottom]);
            if (min === left) {
                    return "left";
            } else if (min === right) {
                    return "right";
            } else if (min === top) {
                    return "top"
            } else {
                    return "bottom";
            }
    }

看完了這篇文章，相信你對(duì)JavaScript獲取鼠標(biāo)移入div方向的方法是什么有了一定的了解，想了解更多相關(guān)知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道，感謝各位的閱讀！