Heim  >  Artikel  >  Web-Frontend  >  So erhalten Sie mithilfe von JavaScript die Richtung der Mausbewegung in div

So erhalten Sie mithilfe von JavaScript die Richtung der Mausbewegung in div

云罗郡主
云罗郡主nach vorne
2018-11-10 15:07:451652Durchsuche

Der Inhalt dieses Artikels handelt davon, wie man mit JavaScript die Richtung ermittelt, in der man die Maus in ein Div bewegt. Ich hoffe, dass er für Freunde hilfreich ist.

Vor ein paar Tagen habe ich gesehen, dass die Textbeschriftungen entsprechend der Bewegungsrichtung der Maus geladen werden, also wollte ich eine solche Funktion implementieren. Nach einigem Suchen und Suchen habe ich zwei Implementierungsmethoden gefunden.

So erhalten Sie mithilfe von JavaScript die Richtung der Mausbewegung in div

Methode 1: Verwenden Sie vier Divs, um einen Bereich zu bilden. Von welchem ​​Div aus Sie sich bewegen, ist die Richtung, aus der Sie sich bewegen.

Methode 2: Ermitteln Sie den Punkt, an dem sich die Maus bewegt, und welche Seite links, rechts, oben und unten am Div liegt. Die nächstgelegene Seite ist die Richtung, in die sich die Maus bewegt.

Für Methode zwei habe ich eine kleine Methode geschrieben. Der Code lautet wie folgt, nur als Referenz:

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";
            }
    }

Das Obige ist eine vollständige Einführung, wie JavaScript die Richtung bestimmt, in die sich die Maus bewegt a div. Wenn Sie mehr über JavaScript-Tutorial erfahren möchten, schauen Sie sich bitte die chinesische PHP-Website an.


Das obige ist der detaillierte Inhalt vonSo erhalten Sie mithilfe von JavaScript die Richtung der Mausbewegung in div. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:lvyestudy.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen