Skip to content

Instantly share code, notes, and snippets.

@dursk

dursk/index.html

Created May 10, 2017 23:19
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dursk/de7a59c5bad6c94dde67285b4aa630e6 to your computer and use it in GitHub Desktop.
Save dursk/de7a59c5bad6c94dde67285b4aa630e6 to your computer and use it in GitHub Desktop.
Download ZIP
Exported from Popcode. Click to import: https://popcode.org/?gist=de7a59c5bad6c94dde67285b4aa630e6
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<div id="game">
<div id="bar"></div>
</div>
</body>
</html>
Raw
popcode.json
{"enabledLibraries":["jquery"]}
Raw
script.js
$("body").keydown(function(event) {
// STEP 1
// Store the current left offset of the bar
// in the position variable below.
var position;
// STEP 2
// For the left key, adjust the if statement so that
// it is only true if the position of the bar is greater than 13.
if (event.which === 37 && position > 13) {
$("#bar").css("left", position - 10);
// STEP 3
// For the right key, adjust the if statement so that
// is is only true if the position of the bar is less than 483.
} else if (event.which === 39 && position < 483) {
$("#bar").css("left", position + 10);
} else {
return;
}
});
Raw
styles.css
#game {
border: 5px solid black;
height: 500px;
width: 500px;
}
#bar {
background-color: black;
height: 8px;
width: 30px;
position: absolute;
margin-top: 480px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment