Hej. Jeg er ved at kode noget halløj med JavaScript, og jeg har lavet en fejl som jeg simpelthen bare ikke kan finde. Problemet er at når jeg indlæser siden i FF, forsvinder min header, og dermed min title og mit stylesheet. Jeg fatter virkelig ikke hvad der er galt, og jeg har brugt næsten en time på at finde ud af det.
Jeg har følgende filer:
index.html
<html>
<head>
<title>Test Canvas</title>
<link rel="stylesheet" type="text/css" href="stil.css" />
<script type="text/javascript" src="script.js"></script>
</head>
<body onLoad="drawlevel(1)">
</body>
</html>
stil.css
body
{
margin:10px;
}
.square
{
position:absolute;
z-index:1;
display:none;
}
#mario
{
position:absolute;
z-index:11;
}
script.js
//Funktion der generere CSS'en og positionere samtlige 20 linjer
//Jo længere banen skal være jo større er ROW
function drawlines(rows) {
//Følgende WHILE køres 20 gange og X er lig med det antal gange den er blevet kørt
var x = 1;
while (x <= 20)
{
//Name er navnet på DIV'en
var name = "line" + x;
//Skriver DIV NAME ud i HTML
document.write('<div id="' + name + '">');
var y = 1;
//Skriver inholdet af DIV NAME ud på skærmen. DIVen skal indeholder ROWS antal kolonner
while (y <= rows)
{
document.write('<span id="' + x + '-' + y + '" class="square"><img src="sky.png"></span>');
y ++;
}
//Indholdet af diven er lavet og derefter lukkes den
document.write('</div>');
//DIV'en er nu lavet og lukket, og vi positinere den derfor nu med DOM
document.getElementById(name).style.position = 'absolute';
document.getElementById(name).style.top = (x - 1) * 20 + 'px';
document.getElementById(name).style.left = '0px';
document.getElementById(name).style.width = rows * 20;
//X forøges og møllen køre igen hvis X stadig er mindre end 20
x ++;
}
}
function drawlevel1() {
//Kalder funktionen drawlines der laver en bane med 50 linjer
drawlines(50);
for (y=17;y<=20;y++)
{
for (x=1;x<=50;x++)
{
name = y + '-' + x;
document.getElementById(name).innerHTML = '<img src="gro.png" />';
}
}
//Laver Mario
createMario(100,50);
}
//Funktionen der tegner banen på skærmen
function drawlevel(level) {
var wich = 'drawlevel' + level + '();';
eval(wich);
}
//Denne funktion laver Mario
function createMario(x,y)
{
document.write('<div id="mario"><img src="mario.png">LAUF</div>');
var mario = document.getElementById("mario");
mario.style.left = x + 'px';
mario.style.top = y + 'px';
mario.style.zIndex = '11';
}