Ask bosses-CodePudding

I want to do the effect is similar to the snake, click on the keyboard up and down or so let div sports, but I have a problem of js function, click a few times after the up and down or so, div started in a place like into a few div constantly vibrating back and forth, this is what happened, please answer, and if you want to be like snake to eat small div, corresponding div what should disappear, thank you!

CodePudding user response:

The var time=null; Put the document. The onkeydown event outside the statement,
Each clearInterval () on the setInterval (),

CodePudding user response:

CSS I remember not have display attributes, can be used to should disappear

CodePudding user response:

reference 1/f, the sky wave response:

var time=null; Put the document. The onkeydown event outside the statement,
Each clearInterval () on the setInterval () front of

Thank you big! Again, can ask bosses about big div to eat small div, small div how disappear, if the bosses can be free to consult thank you very much!

CodePudding user response:

You send the text form of code, pictures, I can't modify and debug

CodePudding user response:

references 4 floor sky waves reply:

you send the text in the form of a code, pictures, I can't modify and debug

Bosses, I direct copying code over as if replication is not complete, there is no other way to you

CodePudding user response:

 
Window. The onl oad=function () {
Var odiv=document. GetElementsByClassName (' random '); 
for(var i=0; IVar ot=document. GetElementById (" outer "); 
Var w=ot. ClientHeight | | ot the offsetWidth, h=ot. ClientHeight | | ot. OffsetHeight; 
Var x=Math. The random () * w; 
Var y=Math. The random () * h; 
Odiv [I]. Style. Left=x + "px"; 
Odiv [I] style. The top=y + "px"; 
} 
} 
Var time=null; 
The function start () {
Document. The onkeydown=function (ev) {
Var oEvent=ev | | event; 
Var speed=10; 
Var tdiv=document. GetElementById (" target "); 

The switch (oEvent keyCode) {
//
A case of 38: 
ClearInterval (time); 
Time=setInterval (function () {
Tdiv. Style. The top=tdiv. OffsetTop -speed + "px"; 
Collide (); 
30)}, 

break; 

Under the//
A case of 40: 
ClearInterval (time); 
Time=setInterval (function () {
Tdiv. Style. The top=tdiv. OffsetTop + speed + "px"; 
Collide (); 
30)}, 

break; 

//left 
Case of 37: 
ClearInterval (time); 
Time=setInterval (function () {
Tdiv. Style. Left=tdiv. OffsetLeft -speed + "px"; 
Collide (); 
30)}, 
break; 

//right 
Case 39: 
ClearInterval (time); 
Time=setInterval (function () {
Tdiv. Style. Left=tdiv. OffsetLeft + speed + "px"; 
Collide (); 
30)}, 
break; 

} 
} 
} 

The function collide () {
Var tdiv=document. GetElementById (" target "); 
Var t=tdiv. GetBoundingClientRect (); 
Var odiv=document. GetElementsByClassName (' random '); 
for(var i=0; IVar g=odiv [I] getBoundingClientRect (); 
if (! (t.l eft> G.r d.light | | t.r ight G.b ottom | | t.b ottomOdiv [I] parentNode. RemoveChild (odiv [I]); 
} 
} 
}

CodePudding user response:

cited the 6th floor sky wave response:

 
Window. The onl oad=function () {
Var odiv=document. GetElementsByClassName (' random '); 
for(var i=0; IVar ot=document. GetElementById (" outer "); 
Var w=ot. ClientHeight | | ot the offsetWidth, h=ot. ClientHeight | | ot. OffsetHeight; 
Var x=Math. The random () * w; 
Var y=Math. The random () * h; 
Odiv [I]. Style. Left=x + "px"; 
Odiv [I] style. The top=y + "px"; 
} 
} 
Var time=null; 
The function start () {
Document. The onkeydown=function (ev) {
Var oEvent=ev | | event; 
Var speed=10; 
Var tdiv=document. GetElementById (" target "); 

The switch (oEvent keyCode) {
//
A case of 38: 
ClearInterval (time); 
Time=setInterval (function () {
Tdiv. Style. The top=tdiv. OffsetTop -speed + "px"; 
Collide (); 
30)}, 

break; 

Under the//
A case of 40: 
ClearInterval (time); 
Time=setInterval (function () {
Tdiv. Style. The top=tdiv. OffsetTop + speed + "px"; 
Collide (); 
30)}, 

break; 

//left 
Case of 37: 
ClearInterval (time); 
Time=setInterval (function () {
Tdiv. Style. Left=tdiv. OffsetLeft -speed + "px"; 
Collide (); 
30)}, 
break; 

//right 
Case 39: 
ClearInterval (time); 
Time=setInterval (function () {
Tdiv. Style. Left=tdiv. OffsetLeft + speed + "px"; 
Collide (); 
30)}, 
break; 

} 
} 
} 

The function collide () {
nullnullnullnullnullnullnullnullnullnullnullnull