Hi all, I am creating a game but I have ran into a bit of a problem, I am trying to allow the user to drag and drop an image within the game when the user does this the two images swap places.
But my code doesnt seem to be working and i have been staring at it for a coupld of days now.
Can anyone help me
Cheers
Deringer
Here’s the main/index page of the game.
<html>
<head>
<title>Jamjar Game</title>
</head>
<script src="laydiv.js"></script>
<body>
<form name='Scoreboard'>
<table>
<tr>
<td width=500>
<td width=200 align=right>
Click on one piece then on another to swap them. Aim for the minimum swaps.<br><hr>
Correctly placed pieces :
<input type=text name=counter value=0 size=4>
<br>
Number of swaps :
<input type=text size=4 name=clickcount>
<hr>
<input type=button value='ReStart' onclick='location.reload()'>
</table>
</form>
<script>
shuf=new Array()
for(s=1;s<24;s++){
ok=0
while(ok==0){
ok=1
ran=Math.floor(24*Math.random())+1
for(chk=1;chk<shuf.length;chk++){
if(ran==shuf[chk]){ok=0}
}
}
shuf[s]=ran
}
ind=0
for(rows=0;rows<4;rows++){
for(cols=0;cols<6;cols++){
ind++
EndDiv()
GetDiv("dv"+ind,rows*100,cols*100,100,100,'',1,0)
document.write("<a href='javascript:TestMe(",ind,")'><img name=jam",ind," src=jam",shuf[ind],".gif width=75 height=75 border=0 alt='cell no ",ind,"'></a>")
EndDiv()
}
}
picked=0
corrects=0
clickNum=0
function TestMe(x){
clickNum++
if(picked==0){
picked=1
frCell=x
frImgs=shuf[x]
document["images"+x].src='blnk.gif'
return
}
if(picked==1){
picked=0
toCell=x
toImgs=shuf[x]
shuf[x]=frImgs
shuf[frCell]=toImgs
corrects=0
for(y=1;y<24;y++){
document["images"+y].src="jam"+shuf[y]+".gif"
if(y==shuf[y]) corrects++
}
document.Scoreboard.counter.value=corrects
document.Scoreboard.clickcount.value=clickNum/2
if(corrects>=15) {alert("Finished !
Number of swaps needed : "+clickNum/2);(confirm("Again?"))?location.reload():self.close();}
return
}
}
</script>
</body>
Here’s the Layerdiv of the game
N=(navigator.appName.indexOf('Netscape')!=-1&&parseInt(navigator.appVersion)<5)
S=(navigator.appName.indexOf('Netscape')!=-1&&parseInt(navigator.appVersion)>4.9)
M=(navigator.appName.indexOf('Microsoft')!=-1)
var Styl,ID,zX,zY,vis,vs,zz
Vis=new Array()
Vis[0]=(M||S) ? "hidden" : "hide"
Vis[1]=(M||S) ? "visible" : "show"
function GetDiv(divId,divY,divX,divW,divH,bCol,visb,zInd){
bkCol=(bCol!="")?((N)?" bgColor="+bCol:";background:"+bCol):""
Styl = (M||S) ? "<DIV" : "<LAYER"
if(M||S){
Styl+=" ID="+divId
Styl+=" style='position:absolute;top:"+divY+";left:"+divX+";width:"+divW+";height:"+divH+bkCol
Styl+=";visibility:"+Vis[visb]+";z-index:"+zInd
Styl+="'>"
}
if(N){
Styl+=" ID="+divId
Styl+=" top="+divY+" left="+divX+" width="+divW+" height="+divH+bkCol
Styl+=" visibility="+Vis[visb]+" z-index="+zInd
Styl+=">"
}
document.writeln(Styl)
}
function EndDiv(){
(M||S)? document.writeln("</DIV>"): document.writeln("</LAYER>")
}
function PutIt(ID,zX,zY){
if(N){
document.layers[ID].left=zX
document.layers[ID].top=zY
}
if(M){
document.all[ID].style.left=zX
document.all[ID].style.top=zY
}
if(S){
document.getElementById(ID).style.left=zX
document.getElementById(ID).style.top=zY
}
}
function TopOf(ID,tp){
if(N){
return parseInt(document.layers[ID].top)
}
if(M){
return parseInt(document.all[ID].style.top)
}
if(S){
return parseInt(document.getElementById(ID).style.top)
}
}
function LeftOf(ID){
if(N){
return parseInt(document.layers[ID].left)
}
if(M){
return parseInt(document.all[ID].style.left)
}
if(S){
return parseInt(document.getElementById(ID).style.left)
}
}
function ShowHide(ID,vs){
if(N){
document.layers[ID].visibility=Vis[vs]
}
if(M){
document.all[ID].style.visibility=Vis[vs]
}
if(S){
document.getElementById(ID).style.visibility=Vis[vs]
}
}
function Zind(ID,zz){
if(N){
document.layers[ID].zIndex=zz
}
if(M){
document.all[ID].style.zIndex=zz
}
if(S){
document.getElementById(ID).style.zIndex=zz
}
}
function lyrWrt(IdName,Str) {
if (N){
document.layers[IdName].document.write(Str)
document.layers[IdName].document.close()}
if(M) document.all[IdName].innerHTML=Str
if(S) document.getElementById(IdName).innerHTML=Str
}
