JSFiddle - React, Tailwind, and code Playground

by ZachWills

HTML

<div class="password-box"></div>

CSS

.password-box {
background:url("http://placekitten.com/300/300");
    height:300px;
    width:300px;
}

JavaScript

$(function() {
    password[0][1] = 151;
    password[0][2] = 164;
    password[1][1] = 151;
    password[1][2] = 164;
    $(".password-box").mousemove(function(e) {
        $(".password-box").html(e.pageX + ", " + e.pageY);
    });

    $(".password-box").click(function(e) {
        var boxX = password[0][1] + 40;
        var boxX2 = password[0][1] - 40;
        var boxY = password[1][2] + 40;
        var boxY2 = password[1][2] - 40;

        if (e.pageX < boxX && e.pageX > boxX2 && e.pageY < boxY && e.pageY > boxY2) {
            alert('sup');
        }

    });
});