[英]Javascript I am trying to pause the ball with noloop(); but on key up I want to continue the ball bounce can you look at my code and help me?
我试图用noloop（）暂停球； 但是在钥匙上，我想继续弹跳，您能看看我的代码并为我提供帮助吗？ 我在尝试以帧速暂停弹跳球并返回弹跳球时遇到麻烦。 我设法获得了至少可以识别几个键的代码，但是我只需要一个键即可停止弹跳球，而释放时只需一个键就可以使球弹跳？ 有任何想法吗？ 请帮忙！
<!DOCTYPE html>
<html>
<head>
<title>Player Movement using onkeydown/onkeyup (Enhanced version)</title>
<style type="text/css" media="screen">
canvas { border: 1px solid; }
</style>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-1150473-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<script type="text/javascript" charset="utf-8">
var context;
var x=100;
var y=200;
var dx=5;
var dy=5;
var Key = {
_pressed: {},
LEFT: 37,
UP: 38,
RIGHT: 39,
DOWN: 40,
isDown: function(keyCode) {
return this._pressed[keyCode];
},
onKeydown: function(event) {
this._pressed[event.keyCode] = true;
},
onKeyup: function(event) {
delete this._pressed[event.keyCode];
}
};
window.addEventListener('keyup', function(event) { Key.onKeyup(event); }, false);
window.addEventListener('keydown', function(event) { Key.onKeydown(event); }, false);
var Game = {
fps: 60,
width: 640,
height: 480
};
Game._onEachFrame = (function() {
var requestAnimationFrame = window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame;
if (requestAnimationFrame) {
return function(cb) {
var _cb = function() { cb(); requestAnimationFrame(_cb); }
_cb();
};
} else {
return function(cb) {
setInterval(cb, 1000 / Game.fps);
}
}
})();
Game.start = function() {
Game.canvas = document.createElement("canvas");
Game.canvas.width = Game.width;
Game.canvas.height = Game.height;
Game.context = Game.canvas.getContext("2d");
document.body.appendChild(Game.canvas);
Game.player = new Player();
Game._onEachFrame(Game.run);
};
Game.run = (function() {
var loops = 0, skipTicks = 1000 / Game.fps,
maxFrameSkip = 10,
nextGameTick = (new Date).getTime(),
lastGameTick;
return function() {
loops = 0;
while ((new Date).getTime() > nextGameTick) {
Game.update();
nextGameTick += skipTicks;
loops++;
}
if (loops) Game.draw();
}
})();
Game.draw = function() {
Game.context.clearRect(0, 0, Game.width, Game.height);
Game.player.draw(Game.context);
};
Game.update = function() {
Game.player.update();
};
function Player() {
this.x = 0;
this.y = 0;
}
Player.prototype.draw = function(context) {
context.clearRect(0,0, 300,300);
context.beginPath();
context.fillStyle="#0000ff";
//Draw a circle of radius 20 at the coordinates 100,100 on the canvas
context.arc(this.x, this.y,20,0,Math.PI*2,true);
context.closePath();
context.fill();
if(this.x<0 || this.x>550) dx=-dx;
if(this.y<0 || this.y>400) dy=-dy;
this.x+=dx;
this.y+=dy;
//noLoop();
};
Player.prototype.moveLeft = function() {
this.x = 100;
this.y = 100;
};
Player.prototype.moveRight = function() {
//if (onKeyup) noloop();
//else if (onKeydown) loops();
};
Player.prototype.moveUp = function() {
this.y -= 1;
};
Player.prototype.moveDown = function() {
this.y += 1;
};
Player.prototype.update = function() {
if (Key.isDown(Key.UP)) this.moveUp();
if (Key.isDown(Key.LEFT)) this.moveLeft();
if (Key.isDown(Key.DOWN)) this.moveDown();
if (Key.isDown(Key.RIGHT)) this.moveRight();
//else if (Key.onKeyup(Key.RIGHT)) this.Loop();
};
</script>
</head>
<body onload="Game.start()">
</body>
</html>
我在教授的帮助下找到了答案。 Hovland认为，只需破坏代码即可对其进行测试和调试。 查看序列，有一个循环方法具有一个与之关联的值，并且当更改该值时，循环序列会停顿，并且一旦按下该键便可以返回，注释将在以后发布。
<!DOCTYPE html>
<html>
<head>
<title>Player Movement using onkeydown/onkeyup (Enhanced version)</title>
<style type="text/css" media="screen">
canvas { border: 1px solid; }
</style>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-1150473-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<script type="text/javascript" charset="utf-8">
var nextGameTick = (new Date).getTime();
var isPaused = 0;
var loops = 0;
var context;
var x=100;
var y=200;
var dx=5;
var dy=5;
var Key = {
_pressed: {},
LEFT: 37,
UP: 38,
RIGHT: 39,
DOWN: 40,
isDown: function(keyCode) {
return this._pressed[keyCode];
},
onKeydown: function(event) {
this._pressed[event.keyCode] = true;
},
onKeyup: function(event) {
delete this._pressed[event.keyCode];
}
};
window.addEventListener('keyup', function(event) { Key.onKeyup(event); }, false);
window.addEventListener('keydown', function(event) { Key.onKeydown(event); }, false);
var Game = {
fps: 60,
width: 640,
height: 480
};
Game._onEachFrame = (function() {
var requestAnimationFrame = window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame;
if (requestAnimationFrame) {
return function(cb) {
var _cb = function() { cb(); requestAnimationFrame(_cb); }
_cb();
};
} else {
return function(cb) {
setInterval(cb, 1000 / Game.fps);
}
}
})();
Game.start = function() {
Game.canvas = document.createElement("canvas");
Game.canvas.width = Game.width;
Game.canvas.height = Game.height;
Game.context = Game.canvas.getContext("2d");
document.body.appendChild(Game.canvas);
Game.player = new Player();
Game._onEachFrame(Game.run);
};
Game.run = (function() {
var
skipTicks = 1000 / Game.fps,
maxFrameSkip = 10,
//nextGameTick = (new Date).getTime(),
lastGameTick,
tempTick;
return function() {
loops = 0;
tempTick = (new Date).getTime();
if ( tempTick > nextGameTick) {
Game.update();
nextGameTick += skipTicks;
loops++;
}
if (loops > 0) Game.draw();
else {
console.log("++++++++++++++++++++++++++++++++++");
}
}
})();
Game.draw = function() {
Game.context.clearRect(0, 0, Game.width, Game.height);
Game.player.draw(Game.context);
};
Game.update = function() {
Game.player.update();
};
function Player() {
this.x = 0;
this.y = 0;
}
Player.prototype.draw = function(context) {
context.clearRect(0,0, 300,300);
context.beginPath();
context.fillStyle="#0000ff";
//Draw a circle of radius 20 at the coordinates 100,100 on the canvas
context.arc(this.x, this.y,20,0,Math.PI*2,true);
context.closePath();
context.fill();
if(this.x<0 || this.x>550) dx=-dx;
if(this.y<0 || this.y>400) dy=-dy;
this.x+=dx;
this.y+=dy;
//noLoop();
};
Player.prototype.moveLeft = function() {
loops = -12;
// if(isPaused == 0){
// loops = -1;
// isPaused = 1;
// console.log("paused");
// }
// else if(isPaused == 1){
// loops = 1;
// isPaused = 0;
// console.log("unpaused");
// }
};
Player.prototype.notMoveLeft = function() {
console.log("left arrow up");
//Game.run();
};
Player.prototype.moveRight = function() {
console.log("Foo");
//if (onKeyup) noloop();
//else if (onKeydown) loops();
};
Player.prototype.moveUp = function() {
this.y -= 1;
};
Player.prototype.moveDown = function() {
this.y += 1;
};
Player.prototype.update = function() {
if (Key.isDown(Key.UP)) this.moveUp();
if (Key.isDown(Key.LEFT)) this.moveLeft();
if (Key.isDown(Key.DOWN)) this.moveDown();
if (Key.isDown(Key.RIGHT)) this.moveRight();
if (Key.onKeyup(Key.LEFT)) this.notMoveLeft();
};
</script>
</head>
<body onload="Game.start()">
</body>
</html>
我正在尝试制作“ Ball”类，当它碰到墙时我希望它反弹，但是它仍然被挡在了角落里
[英]I am trying to make this “Ball” class and i want it to bounce when it hits the wall, but it just remains blocked in a corner
我正在尝试使用传单javascript库可视化地图上的某些数据点。您能告诉我我的代码有什么问题吗？
[英]I am trying to visualise some datapoint on a map using leaflet javascript library.Can you tell me whats wrong with my code?
当我单击“全部”h1 元素时，我想切换。textDecoration class。 你能帮我看看这个守则吗？
[英]I want to toggle .textDecoration class when I am clicking on "ALL" h1 elements. Can you Help me with this Code?
我一直在努力使这个球弹跳一天。 为什么不起作用？
[英]I have been trying to make this ball bounce for a day. Why doesnt it work?
在javascript中鼠标单击该对象时消失对象。 在我的情况下，我想通过点击鼠标来消失一个弹跳球
[英]Disappear object on mouse click on that object in javascript. In my case I want to disappear a bouncing ball on the click of the mouse
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.