如何在javascript中从图像中获取像素索引

时间:2012-04-16 10:35:06

标签: javascript image get coordinate

我想让球在击中棋盘时反弹。因此,当球击中棋盘时,我必须得到棋盘像素才能让它反弹。我试过这种方式,但它不起作用。 这是我的代码 Javascript代码

var xboard = document.getElementById(board)
var movx = parseInt(xboard.style.left)

图片代码

<img id="board" style="z-index: 0; left: 300;position: absolute; top: 600px" align=baseline border=0 hspace=0 src="design/board.gif">

当我试图通过

获取像素时
alert(movx)

警告框中显示“未定义”。 有谁可以帮助我?

3 个答案:

答案 0 :(得分:1)

我认为你需要用px声明这个位置:

left: 300px

似乎有效:http://jsfiddle.net/p2gRq/

答案 1 :(得分:0)

此方法为您提供传递的控件坐标

<img id="board" style="z-index: 0; left: 300;position: absolute; top: 600px" align=baseline border=0 hspace=0 src="design/board.gif">

function findPos(obj){
var curleft = 0;
var curtop = 0;

if (obj.offsetParent) {
    do {
        curleft += obj.offsetLeft;
        curtop += obj.offsetTop;
       } while (obj = obj.offsetParent);

    return {X:curleft,Y:curtop};
}
}

findPos(document.getElementById('board'));
alert(curleft);
alert(curtop);

有关详细信息here

答案 2 :(得分:0)

您正在尝试使用实际元素而不是id

改变这个:

var xboard = document.getElementById(board);

为:

var xboard = document.getElementById('board');

并确保您在board存在之前没有尝试访问。