Why is this not working ? pushing a box using mouse pointer
===

I'm a beginner in Javascript, and trying to make a simple script that pushes a box using the mouse pointer. But unfortunately it isn't working for some reason, i hope you guys can help me out.

(this script is really primitive, only pushes the box from the left till now).

**index.html :**

    <html>
    <head>
        <title>Chase the box</title>
        <style>
            body {
            }

            .css-box{
                width : 100px;
                height : 100px;
                margin : auto;
                background-color : blue;
            }

        </style>
    </head>

    <body>
        <div id="box" class="css-box"></div>
        <script type="text/javascript" src="script.js"></script>
    </body>

**script.js :** 


    var box = document.getElementById("box");
    
    var pushBox = function(e){
        if(e.pageX == box.offsetLeft){
            box.style.left = box.style.left + 1 + "px";
        }
    };
    
    document.addEventListener("mousemove" , pushBox);

