Writing on the Screen
You can write on the screen using simple JavaScript. Take a look at the code below which is used to write on the screen using the mouse. Please note that the example below does not work on FireFox browser.
<form id="form1" runat="server">
<div>
<h2>My Canvas</h2>
<div id="canvas" style=" background-color:#FFFF99; width:300px; height:300px" onmousemove="DrawPoint(event)" onmousedown="MouseDownHandler()" onmouseup="MouseUpHandler()" onclick="DrawPoint(event)">
</div>
</div>
</form>
</body>
</html>
<script language="javascript" type="text/javascript">
var x;
var
y;
var
mouseState =
'up';
function
MouseDownHandler()
{
mouseState = 'down';
}
function
MouseUpHandler()
{
mouseState = 'up';
}
function
DrawPoint(e)
{
if(mouseState == 'down')
{
var ev = e || window.event;
x = ev.clientX;
y = ev.clientY;
var divElement = document.createElement('div');
divElement.style.position = 'absolute';
divElement.style.top = y;
divElement.style.left = x;
divElement.style.backgroundColor = 'red';
var textNode = document.createTextNode('*');
divElement.appendChild(textNode);
document.body.appendChild(divElement);
}
}
</
script> And here is the effect.
