Witam.
Dostałem zadania do zrobienia na zajęcia - poradziłem sobie ze wszystkim ale to jedno mnie przerosło :)
Proszę o pomoc w wykonaniu tego zadania - jeśli ktoś umie i ma trochę czasu.
Za każdą pomoc z góry dziękuję!

Treść zadania:
Cytat
1. Zapoznaj się z podstawowymi możliwościami biblioteki jsgraphics oraz sposobem jej użycia na elemencie DIV.
2. Zapoznaj się z działaniem funkcji checkS (plik mysz.html).
3. Utwórz stronę na której
- wyświetlana będzie aktualna pozycja myszy (wykorzystuj funkcję checkS)
- utwórz element DIV o szerokości 400px oraz wysokości 300px
Cytat
<div id="okno"
onclick="rys_linie();"
style="position:absolute; background-color:#CCCCCC; left:100px; top:100px;
width:400px; height:300px; z-index:1" >
</div>

4. Do strony„Podłącz” bibliotekę jsgraphics
5. Na elemencie DIV narysuj siatkę o oczku 20px
6. Napisz funkcję która będzie rysowała linie po wybraniu myszką kolejno dwóch punktów przez użytkownika.
Uwaga! Rysowanie ma być realizowane poprzez „przyciąganie do siatki”


Do tego plik mysz.html:

Cytat
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">

<script language="JavaScript" type="text/JavaScript">

function checkS(e){
// capture the mouse position
var posx = 0;
var posy = 0;
if (!e) var e = window.event;
if (e.pageX || e.pageY)
{
posx = e.pageX;
posy = e.pageY;
}
else if (e.clientX || e.clientY)
{
posx = e.clientX;
posy = e.clientY;
}

document.getElementById('pos').innerHTML = 'Mouse position is: X='+posx+' Y='+posy;

document.getElementById('pos').style.left = posx;
document.getElementById('pos').style.top = posy;
}
</script>

</head>

<body onmousemove="checkS(event)">
<div id="pos">test</div>
</body>
</html>


Do tego dostałem jeszcze plik wz_jsgraphics.js:

http://code.google.com/p/eucaly61-java/sou...raphics.js?r=25