Varun Chadha
Varun Chadha

Reputation: 376

Show mousex and mousey position using JavaScript not working

HTML and JavaScript code are shown below and I have checked it in mozila and chrome and it's not working.

This is the HTML part

<form name ="show">
        <input type="text" name="mouseXField" >Mouse X Position<br />
        <input type="text" name="mouseYField" >Mouse Y Position<br />
    </form>

This is javascript part

var mie = (navigator.appName == "Microsoft Internet Explorer") ? true : false;
    if (!mie) {

        document.captureEvent(Event.MOUSEMOVE);
        document.captureEvent(Event.MOUSEDOWN);
    }


    document.onmousemove = mousePos();
    document.onmousedown = mouseClicked();

    var mouseClick=0;
    var keyClicked=0;

    var mouseX = 0;
    var mouseY = 0;

    function mousePos (e) {

        if (!mie) {
            mouseX = e.pageX; 
            mouseY = e.pageY;
        }
        else {
            mouseX = event.clientX + document.body.scrollLeft;
            mouseY = event.clientY + document.body.scrollTop;
         }

    document.show.mouseXField.value = mouseX;
    document.show.mouseYField.value = mouseY;

    return true;
    }

Upvotes: 0

Views: 639

Answers (2)

A J
A J

Reputation: 2140

Here is a solution with jquery : fiddle

var IE = document.all?true:false
if (!IE) document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = getMouseXY;
document.onmousemove = getMouseXY;
        var tempX = 0;
        var tempY = 0;
        function getMouseXY(e) {
            if (IE) { 

            tempX = event.clientX + document.body.scrollLeft
            tempY = event.clientY + document.body.scrollTop
            } 
            else 
            {  
             tempX = e.pageX
             tempY = e.pageY
            }  

            $('#spnCursor').html("x: " + tempX+" y: "+ tempY);

            return true
            }

Upvotes: 1

ioseph
ioseph

Reputation: 1917

Where is the event variable referenced in your else block declared?

Could you also post the html?

A quick google revealed a few jsfiddle pages which achieve what you're after.

Upvotes: 0

Related Questions