• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

HTML code richtig mit javascript

Lukaser

Neues Mitglied
Wenn ich das öffne :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>TESTTESTTEST</title>
<meta name="author" content="Lukas">
<meta name="editor" content="html-editor phase 5">
</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<body>
<script type="text/javascript">

var canvas = document.createElement( 'canvas' );
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.style.display = 'block';
document.body.appendChild( canvas );

var context = canvas.getContext( '2d' );

var image = document.createElement( 'img' );

image.addEventListener('load', function() {

var bitmap = this,
bitmapWidthHalf = Math.floor( this.width / 2 ),
bitmapHeightHalf = Math.floor( this.height / 2 );

document.addEventListener( 'mousemove', function ( event ) {

context.drawImage( bitmap, event.clientX - bitmapWidthHalf, event.clientY - bitmapHeightHalf );

}, false );

document.addEventListener( 'touchstart', function ( event ) {

event.preventDefault();

for ( var i = 0; i < event.touches.length; i++ ) {

context.drawImage( bitmap, event.touches.pageX - bitmapWidthHalf, event.touches.pageY - bitmapHeightHalf );

}

}, false );

document.addEventListener( 'touchmove', function ( event ) {

event.preventDefault();

for ( var i = 0; i < event.touches.length; i++ ) {

context.drawImage( bitmap, event.touches.pageX - bitmapWidthHalf, event.touches.pageY - bitmapHeightHalf );

}

}, false );

}, false );

image.src = "Bild.jpg";

</script>
</body>
</body>
</html>


das hab ich in dem programm "phase 5.6" erstellt und irgendwie funktioniert es nicht wenn ich es auf internet explorer öffne da kommt dann die frag ob ich scripts oder active x steuerelemte zulasse will und wenn ich bestätige kommt nur einw weiße seite ich hab im Ordner "C:\Users\Ich\Pictures" ein bild mit dem nahmen BILD.jpg das script soll bewirken dass das bild der maus folgt
Bitte um schnelle un dunkomplizierte kösung (Bin noch anfänger)
 
Der Internet Explorer ( bis Version 8 ) unterstützt die canvas-Funktionen nicht.

Bitte nutze in Zukunft die HTML-Code-Tags der Forensoftware um deinen Quelltext zu markieren. Im übrigen öffnest und schließt du das body-Tag zwei mal.
 
Danke für die schnelle antwort trozdem funktioniert es nicht welche body soll ich entfernen der code schaut so aus :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>TESTTESTTEST</title>
<meta name="author" content="Lukas">
<meta name="editor" content="html-editor phase 5">
</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<body>
<script type="text/javascript">

var canvas = document.createElement( 'canvas' );
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.style.display = 'block';
document.body.appendChild( canvas );

var context = canvas.getContext( '2d' );

var image = document.createElement( 'img' );

image.addEventListener('load', function() {

var bitmap = this,
bitmapWidthHalf = Math.floor( this.width / 2 ),
bitmapHeightHalf = Math.floor( this.height / 2 );

document.addEventListener( 'mousemove', function ( event ) {

context.drawImage( bitmap, event.clientX - bitmapWidthHalf, event.clientY - bitmapHeightHalf );

}, false );

document.addEventListener( 'touchstart', function ( event ) {

event.preventDefault();

for ( var i = 0; i < event.touches.length; i++ ) {

context.drawImage( bitmap, event.touches.pageX - bitmapWidthHalf, event.touches.pageY - bitmapHeightHalf );

}

}, false );

document.addEventListener( 'touchmove', function ( event ) {

event.preventDefault();

for ( var i = 0; i < event.touches.length; i++ ) {

context.drawImage( bitmap, event.touches.pageX - bitmapWidthHalf, event.touches.pageY - bitmapHeightHalf );

}

}, false );

}, false );

image.src = "C:\Users\Lukas\Documents\html\Bild.jpg";

</script>
</body>
</body>
</html>
 
Danke für die schnelle antwort trozdem funktioniert es nicht welche body soll ich entfernen

Hallo.

HTML:
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<body>
Fällt dir was auf?

Ausserdem ist noch anzumerken das du veralteten Code benutzt.
Die Gestaltung solltest du lieber mit CSS machen.

Gruss
Elroy
 
Zurück
Oben