Results 1 to 4 of 4

Thread: how to find the position of coordinate on clicked position ?

  1. #1
    Join Date
    May 2007
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default how to find the position of coordinate on clicked position ?

    hello forums!!
    I am wondering to know -
    how to find the position of coordinate on clicked position ? using javascript.

    Case:
    Suppose i had a image ,when mouse is clicked @ certain position of image, then it should alert the x & y coordinate of that point..

    Awaiting for your great help..
    Thanks in advance to all of you

  2. #2
    Join Date
    May 2007
    Location
    USA
    Posts
    373
    Thanks
    2
    Thanked 4 Times in 4 Posts

    Default

    Code:
    var Xm, Ym;
    if(window.addEventListener) window.addEventListener("click", mouseClick, false);
    else window.document.attachEvent("onclick", mouseClick);
    function mouseClick(e){
    	var o = (e.target) ? e.target : e.srcElement;
    	Xm = (e.pageX) ? e.pageX : e.clientX;
    	Ym = (e.pageX) ? e.pageY : e.clientY;
    	alert(o+"\nAbs: ("+Xm+","+Ym+")"+"\nRel: ("+(Xm-o.offsetLeft)+","+(Ym-o.offsetTop)+")");
    	}

  3. #3
    Join Date
    Jan 2007
    Posts
    31
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Try out this too:
    Code:
    	document.onclick = function(e){
    		var curleft = curtop = 0;
    		var curleft1 = curtop1 = 0;
    		
    		var e = e ? e : window.event;
    		var obj = e.target? e.target : e.srcElement;
    		curleft = obj.offsetLeft
    		curtop = obj.offsetTop
    		while (obj = obj.offsetParent) {
    			curleft += obj.offsetLeft;
    			curtop += obj.offsetTop;
    		}
    		alert('It\'s an anchor\r\nX = ' + curleft + '\r\nY=' + curtop);
    	}

  4. #4
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,162
    Thanks
    263
    Thanked 690 Times in 678 Posts

    Default

    You could also use the image input element in a form and get the clicked cooridinates as a result of the submitted form if that fits your plan.

    form:
    <form action="next.php" method="post"...>
    <input type="image" name="clickimg">
    ...
    </form>

    On next.php:
    <?php
    echo $_POST['clickimg_y'];
    echo " - "; //just to seperate
    echo $_POST['clickimg_x'];
    ?>
    Daniel - Freelance Web Design | <?php?> | <html>| espa˝ol | Deutsch | italiano | portuguŕs | catalÓ | un peu de franšais | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •