Archivlink: javarea.de Forum > JavaScript > Problem mit Grafiken
Vollständigen Link anzeigen: javarea.de Forum > JavaScript > Problem mit Grafiken

Pages: [1]

geschrieben von lomion am 05.01.2006 - 14:30
Hi an Alle...
ich habe ein kleines Problem...ich möchte auf eine Homepage ein Javaspielchen packen...geschrieben in javascript...das habe ich irgendwann einmal im netz gefunden...leider habe ich nicht so viel ahnung von javascript um das script meine bedürfnissen 100% anzupassen...
Problem: ich möchte anstatt der hintergrundfarbe eine grafik (20x20px) haben...
zum anschauen geb ich mal den link
und den Quelltext:
HTML-Quelltext
1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
10: 
11: 
12: 
13: 
14: 
15: 
16: 
17: 
18: 
19: 
20: 
21: 
22: 
23: 
24: 
25: 
26: 
27: 
28: 
29: 
30: 
31: 
32: 
33: 
34: 
35: 
36: 
37: 
38: 
39: 
40: 
41: 
42: 
43: 
44: 
45: 
46: 
47: 
48: 
49: 
50: 
51: 
52: 
53: 
54: 
55: 
56: 
57: 
58: 
59: 
60: 
61: 
62: 
63: 
64: 
65: 
66: 
67: 
68: 
69: 
70: 
71: 
72: 
73: 
74: 
75: 
76: 
77: 
78: 
79: 
80: 
81: 
82: 
83: 
84: 
85: 
86: 
87: 
88: 
89: 
90: 
91: 
92: 
93: 
94: 
95: 
96: 
97: 
98: 
99: 
100: 
101: 
102: 
103: 
104: 
105: 
106: 
107: 
108: 
109: 
110: 
111: 
112: 
113: 
114: 
115: 
116: 
117: 
118: 
119: 
120: 
121: 
122: 
123: 
124: 
125: 
126: 
<script language="javascript">
var index;
var objBox;
var box;
var iTimesAnimate;
var blnGameStarted;
var TotalDisplay;
index=10;
blnGameStarted = false;
TotalDisplay = 0;
function changeColorOn(abc)
{abc.color="white";
abc.backgroundColor="black"}
function changeColorOff(abc)
{abc.color="black";
abc.backgroundColor="white"}
function animate()
{document.herwick.btnStart.disabled = true;
if(index < 102)
{document.all[index-1].style.backgroundColor="white";
document.all[index].style.backgroundColor="red";
setTimeout('animate()',75);
index = index + 1;
}else{
setTimeout('document.all[101].style.backgroundColor="white"',75);
initialize();}}
function checkClick(objBox1)
{if(blnGameStarted)
{objBox = objBox1;
if(objBox.backgroundColor == "red")
{document.herwick.txtScore.value = eval(document.herwick.txtScore.value) + 1;
}else{
objBox.backgroundColor = "blue";
setTimeout('objBox.backgroundColor = "white"',200);
}}}
function getRandom()
{return (Math.round(Math.random()*(97-9)))+9;}
function highlightBox()
{if(blnGameStarted)
{box = getRandom();
document.all[box].style.backgroundColor = "red";
TotalDisplay = TotalDisplay + 1;
setTimeout('document.all[box].style.backgroundColor = "white"',700);
setTimeout('highlightBox()',800);}}
function startTime()
{if(eval(document.herwick.txtTime.value)  != 0)	{
document.herwick.txtTime.value = eval(document.herwick.txtTime.value) - 1;
setTimeout('startTime()',1000);
}else{
alert('Zeit vorbei!!! \n\n Bitte tragen Sie sich in der Highscore ein!');
document.herwick.btnStart.disabled = false;
blnGameStarted = false;}}
function initialize()
{blnGameStarted = confirm('Sind Sie bereit Ihre Reflexe zu testen??')
if(blnGameStarted)
{document.herwick.txtTime.value = 30;
document.herwick.txtScore.value = 0;
setTimeout('startTime()',10);
highlightBox();
}else
document.herwick.btnStart.disabled = false;}
</script><html><head><title>Herwick - Reflextester</title></head>
<body onLoad="javascript:animate();" style="cursor:default">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td align="center" valign="middle">
<table width="400" border="4" cellpadding="8" cellspacing="0" style="border-color:blue;boder-style:outset">
<tr><input type='hidden' name="9"></font>
<td name="10" onClick="javascript:checkClick(this.style);">&nbsp;</td>
    .
    .
    .
<td name="19" onClick="javascript:checkClick(this.style);">&nbsp;</td>
</tr><tr>
<td name="20" onClick="javascript:checkClick(this.style);">&nbsp;</td>
    .
    .
    .
<td name="29" onClick="javascript:checkClick(this.style);">&nbsp;</td>
</tr><tr>
<td name="30" onClick="javascript:checkClick(this.style);">&nbsp;</td>
    .
    .
    .
<td name="39" onClick="javascript:checkClick(this.style);">&nbsp;</td>
</tr><tr>
<td name="40" onClick="javascript:checkClick(this.style);">&nbsp;</td>
    .
    .
    .
<td name="49" onClick="javascript:checkClick(this.style);">&nbsp;</td>
</tr><tr>
<td name="50" onClick="javascript:checkClick(this.style);">&nbsp;</td>
    .
    .
    .
<td name="59" onClick="javascript:checkClick(this.style);">&nbsp;</td>
</tr><tr>
<td name="60" onClick="javascript:checkClick(this.style);">&nbsp;</td>
    .
    .
    .
<td name="69" onClick="javascript:checkClick(this.style);">&nbsp;</td>
</tr><tr>
<td name="70" onClick="javascript:checkClick(this.style);">&nbsp;</td>
    .
    .
    .
<td name="79" onClick="javascript:checkClick(this.style);">&nbsp;</td>
</tr><tr>
<td name="80" onClick="javascript:checkClick(this.style);">&nbsp;</td>
    .
    .
    .
<td name="89" onClick="javascript:checkClick(this.style);">&nbsp;</td>
</tr></table></td></tr>
<tr> <td align="center"><form name="herwick" method="post" action="highscore.php">
<table width="400" border="0" cellpadding="8" cellspacing="0">
<tr><td>&nbsp;</td></tr>
<tr><td align="left"><b>Punktzahl:</b><input name="txtScore" type="text" readonly style="width:50px" value=0 size="25" maxlength="20" readonly char="5">
</td><td align="center">
<input type="button" name="btnStart" value="Start" onClick="javascipt:document.buzzy.btnStart.disabled = true;initialize();" style="width:75px">
</td><td align="right"><b>Zeit:</b><input name="txtTime" type="text"  readonly style="width:50px" value=30 size="25" maxlength="20" readonly char="5">
</td></tr><tr><td><b>Name:</b><input name="name" type="text" maxlength="25">
</td><td><input type="submit" name="Submit" value="Senden" style="width:75px">
</td><td>&nbsp;</td></tr></table></form></td></tr></table></body>
</html>


Danke schon einmal im voraus...
lomion

geschrieben von Micha am 10.01.2006 - 00:17
Hallo, dann tausche:

HTML-Quelltext
1: 
document.all[box].style.backgroundColor = "red";


entsprechend aus. Hier findest Du eine Übersicht über alle style-Attribute, die Du so ansprechen kannst (und ändern kannst). Für Dich käme vll ein anderes Hintergrundbild in Frage?

http://de.selfhtml.org/javascript/o....enschaften

Michael

geschrieben von lomion am 10.01.2006 - 15:07
hey danke für die antwort..mal schaun..ich meld mich weder sobald ich mehr weiß..


Powered by: JBB v.2.0.4 Copyright ©2000-2006, www.javarea.de.