JavaScript zum Erzielen eines einfachen Drag-Effekts

* {
            Rand: 0;
            Polsterung: 0;
        }
        
        P {
            Hintergrund: himmelblau;
            Textausrichtung: zentriert;
        }
        
        html,
        Körper {
            Breite: 100 %;
            Höhe: 100%;
        }
        
        .Maske {
            Breite: 100 %;
            Höhe: 100%;
            Position: fest;
            links: 0;
            oben: 0;
            Hintergrund: rgba(0, 0, 0, .5);
            Anzeige: keine;
        }
        
        .Anmelden {
            Breite: 400px;
            Höhe: 300px;
            Hintergrund: lila;
            Position: absolut;
            links: 50%;
            oben: 50 %;
            transformieren: übersetzen(-50 %, -50 %);
            Anzeige: keine;
            Cursor: bewegen;
        }
        
        .login>span {
            Anzeige: Inline-Block;
            Breite: 50px;
            Höhe: 50px;
            Hintergrund: rot;
            Position: absolut;
            oben: 0;
            rechts: 0;
        }

<p>Ich bin ein P-Tag</p>
    <a href="http://www.baidu.com" >Offizielle Website</a>
    <div Klasse="Maske"></div>
    <div Klasse="Anmelden">
        <span></span>
</div>

//1. Das zu bearbeitende Element abrufen const oP = document.querySelector("p");
const oMask = document.querySelector(".mask");
const oLogin = document.querySelector(".login");
const oClose = oLogin.querySelector(".login>span");
// console.log(oSchließen);
 
//2. Auf Klickereignisse warten oP.onclick = function() {
    oMask.style.display = "Block";
    oLogin.style.display = "Block";
        };
        oSchließen.onclick = function() {
            oMask.style.display = "keine";
            oLogin.style.display = "keine";
        };
 
//3. Warten Sie auf die Druck- und Bewegungsereignisse des Anmeldefelds oLogin.onmousedown = function(e) {
            e = e || e.Fenster;
 
            //1. Berechnen Sie die feste Distanz const x = e.pageX - oLogin.offsetLeft;
            const y = e.pageY - oLogin.offsetTop;
            // console.log(x);
 
            //2. Auf mobile Ereignisse warten oLogin.onmousemove = function(e) {
                e = e || e.Fenster;
 
                //3. Berechnen Sie den Offset nach der Verschiebung let offsetX = e.pageX - x;
                sei offsetY = e.pageY - y;
 
                //4. Position des Anmeldefelds zurücksetzen oLogin.style.left = offsetX + 'px';
                oLogin.style.top = offsetY + 'px';
            };
        };
 
        oLogin.onmouseup = Funktion() {
            oLogin.onmousemove = null;
        };