testo_html
Neues Mitglied
Hallo ich hätte nochmal eine frage und zwar versuche ich eine kleine zeichnungstool auf meiner html Website einzufügen der Code lautet wie folgt :
<html>
<style>
body {
margin: 0;
padding 0;
}
</style>
<body>
<script>
var canvas, context, mouse = { x: 0, y: 0 };
init();
function init() {
canvas = document.createElement( 'canvas' );
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.style.cursor = 'crosshair';
context = canvas.getContext( '2d' );
context.strokeStyle = 'rgb(0,0,0)';
context.lineWidth = 0.5;
document.addEventListener( 'mousedown', onDocumentMouseDown, false );
document.addEventListener( 'mouseup', onDocumentMouseUp, false );
document.body.appendChild( canvas );
}
function onDocumentMouseDown( event ) {
mouse.x = event.clientX;
mouse.y = event.clientY;
document.addEventListener( 'mousemove', onDocumentMouseMove, false );
}
function onDocumentMouseUp( event ) {
document.removeEventListener( 'mousemove', onDocumentMouseMove, false );
}
function onDocumentMouseMove( event ) {
context.beginPath();
context.moveTo( mouse.x, mouse.y );
context.lineTo( event.clientX, event.clientY );
context.stroke();
mouse.x = event.clientX;
mouse.y = event.clientY;
}
</script>
</body>
</html>
dieser code funktioniert auf dem pc auch sehr gut wenn ich ihn allerdings auf safari auf meinem tablet öffne kann man dort nicht mit diesem Zeichnen muss ich noch etwas ändern ? oder hinzufügen ?
LG :-D
<html>
<style>
body {
margin: 0;
padding 0;
}
</style>
<body>
<script>
var canvas, context, mouse = { x: 0, y: 0 };
init();
function init() {
canvas = document.createElement( 'canvas' );
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.style.cursor = 'crosshair';
context = canvas.getContext( '2d' );
context.strokeStyle = 'rgb(0,0,0)';
context.lineWidth = 0.5;
document.addEventListener( 'mousedown', onDocumentMouseDown, false );
document.addEventListener( 'mouseup', onDocumentMouseUp, false );
document.body.appendChild( canvas );
}
function onDocumentMouseDown( event ) {
mouse.x = event.clientX;
mouse.y = event.clientY;
document.addEventListener( 'mousemove', onDocumentMouseMove, false );
}
function onDocumentMouseUp( event ) {
document.removeEventListener( 'mousemove', onDocumentMouseMove, false );
}
function onDocumentMouseMove( event ) {
context.beginPath();
context.moveTo( mouse.x, mouse.y );
context.lineTo( event.clientX, event.clientY );
context.stroke();
mouse.x = event.clientX;
mouse.y = event.clientY;
}
</script>
</body>
</html>
dieser code funktioniert auf dem pc auch sehr gut wenn ich ihn allerdings auf safari auf meinem tablet öffne kann man dort nicht mit diesem Zeichnen muss ich noch etwas ändern ? oder hinzufügen ?
LG :-D
