notclive Posted June 12, 2006 Share Posted June 12, 2006 //write text in text boxdocument.getElementById("info").innerHTML="Your turn - You are the red team";//set square type as variablevar sqtype = "enemy";//creat three lines of 8 imagesfor (r=1;r<=3;r++){for (c=1;c<=8;c++){document.write('<img src="'+sqtype+'.png" onMouseDown="turn(gridRef'+r+c+')" id="gridRef'+r+c+'" alt="'+sqtype+'" />');//alternate image typeif(sqtype=="enemy"){sqtype="vacant2"}else{sqtype="enemy"};}//alternate image every line alsoif(sqtype=="enemy"){sqtype="vacant2"}else{sqtype="enemy"};}//do the same for 2 more linesvar sqtype = "vacant2";for (r=4;r<=5;r++){for (c=1;c<=8;c++){document.write('<img src="'+sqtype+'.png" onMouseDown="turn(gridRef'+r+c+')" id="gridRef'+r+c+'" alt="'+sqtype+'" />');if(sqtype=="vacant2"){sqtype="vacant1"}else{sqtype="vacant2"};}if(sqtype=="vacant2"){sqtype="vacant1"}else{sqtype="vacant2"};}//and same for three more linesvar sqtype = "vacant2";for (r=6;r<=8;r++){for (c=1;c<=8;c++){document.write('<img src="'+sqtype+'.png" onMouseDown="turn(gridRef'+r+c+')" id="gridRef'+r+c+'" alt="'+sqtype+'" />');if(sqtype=="vacant2"){sqtype="player"}else{sqtype="vacant2"};}if(sqtype=="vacant2"){sqtype="player"}else{sqtype="vacant2"};}//function to happen when user clicks imagefunction turn(grid){if (document.getElementById(grid).alt=="enemy"){document.getElementById("info").innerHTML="Your turn - This is not your piece";}} whats supposed to happen; when the user clicks the image the function turn() will happen this gets the id of the image and see's if this image has the alt of enemy and if so writes Your turn - This is not your piece in the info box.what happens; nothing, the images appear fine, but when i click i get this error in the javascript console Event thread: mousedownError:name: TypeErrormessage: Statement on line 3: Could not convert undefined or null to objectBacktrace: Line 3 of linked script http://coding.notclive.co.uk/draughts.js if ((document.getElementById(grid)).src == "enemy.png") Line 1 of script turn(gridRef51); At unknown location [statement source code not available] Link to comment Share on other sites More sharing options...
scott100 Posted June 12, 2006 Share Posted June 12, 2006 (edited) what happens; nothing, the images appear fine, but when i click i get this error in the javascript console Event thread: mousedowntry this, different aproachgive the pic an id, then pass that id to the function, then in the function get the alt of the id, this will work.<head><script>function turn([color=red]mypic[/color]){if (document.getElementById([color=red]mypic[/color]).[color=red]alt[/color]=="enemy"){document.getElementById("info").innerHTML="Your turn - This is not your piece";}}</script></head><body><img [color=red]id="pic"[/color] alt="enemy" src="http://www.google.co.uk/logos/worldcup06_uk.gif" onclick="[color=red]turn(this.id)[/color]" /><div id="info">hello</div></body> Edited June 12, 2006 by scott100 Link to comment Share on other sites More sharing options...
notclive Posted June 12, 2006 Author Share Posted June 12, 2006 so i have to make 64 pictures individually instead of using the document.write.. Link to comment Share on other sites More sharing options...
aspnetguy Posted June 12, 2006 Share Posted June 12, 2006 no you can still do it dynamically you will just have to use a counter to giv ethe img unique ids....pic1, pic2, etc Link to comment Share on other sites More sharing options...
scott100 Posted June 12, 2006 Share Posted June 12, 2006 (edited) so i have to make 64 pictures individually instead of using the document.write..<{POST_SNAPBACK}> Im not entirely sure what your doing as i couldnt test your code, are you using javascript then to write out the images onto the page i take it?If so you could create a counter in your for loops that increments by one each time you go rounddocument.write('<img id="'+counter+'" src="'+sqtypecounter+=1;then pass that id to the function ??EDIT ahhhhhhh, i'm going to kill aspneyguy if he beats me one more time today Edited June 12, 2006 by scott100 Link to comment Share on other sites More sharing options...
notclive Posted June 12, 2006 Author Share Posted June 12, 2006 to late i put them in html wasnt so bad Link to comment Share on other sites More sharing options...
scott100 Posted June 12, 2006 Share Posted June 12, 2006 to late i put them in html wasnt so bad<{POST_SNAPBACK}> Oh well Is your problem now fixed, is it working as it should? Link to comment Share on other sites More sharing options...
notclive Posted June 12, 2006 Author Share Posted June 12, 2006 for some reason it put spaces between all my images, why would that be? Link to comment Share on other sites More sharing options...
scott100 Posted June 12, 2006 Share Posted June 12, 2006 for some reason it put spaces between all my images, why would that be?<{POST_SNAPBACK}> The code i posted? :)do you have img{padding:0;margin:0} in the css? Link to comment Share on other sites More sharing options...
notclive Posted June 12, 2006 Author Share Posted June 12, 2006 o you have img{padding:0;margin:0} in the css?image yes margin nothe js is working fine thanks! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now