开发者

Using Javascript on an HTML table?

A few questions, just wondering if anyone can help?

I have a table with ONE long row (1000 pixels) and one single column, how do I go about creating a method w开发者_开发问答hereby when the mouse cursor is on the leftmost side of the cell, a variable, lets say X is set to 0, the further right the mouse cursor moves in the cell, the value of X increases.

I know that sounds like a strange question but I'm working on a project where this type of functionality is desired.

Is there a Javascript method to create this feature?


Is there a javascript method to create this feature?

Yes, there are things in JavaScript which can do what you want. Basically you need to put an "onmousemove" event on your table. The following will work for Firefox and Chrome:

<html>
<body>
<script>
function movedamouse (event)
{
var mytd = document.getElementById ("mytd");
myxpos = event.pageX;
mytext = document.createTextNode (myxpos);
while (mytd.firstChild)
mytd.removeChild (mytd.firstChild);
mytd.appendChild (mytext);
}
</script>
<table>
<tr>
<td>
bbaby
</td>
<td id="mytd" onmousemove="movedamouse(event)"
    style="width:1000px;background:chartreuse">
</td>
</tr>
</table>
</body>
</html>

I'll leave fixing this for Internet Explorer as an exercise. Also, the offset bit needs some work. Anyway this is just to illustrate the idea.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜