Skip to content

Instantly share code, notes, and snippets.

@LtAstros

LtAstros/index.html

Created July 26, 2017 08:06
Show Gist options
  • Save LtAstros/c766fea208b7f7cba7c41981ddaa0a4b to your computer and use it in GitHub Desktop.
Save LtAstros/c766fea208b7f7cba7c41981ddaa0a4b to your computer and use it in GitHub Desktop.
Download ZIP
Exported from Popcode. Click to import: https://popcode.org/?gist=c766fea208b7f7cba7c41981ddaa0a4b
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<div id="blop1" class="blops"></div>
<div id="blop2" class="blops"></div>
<div id="blop3" class="blops"></div>
<div id="blop4" class="blops"></div>
<div id="blop5" class="blops"></div>
<div id="blop6" class="blops"></div>
<div id="blop7" class="blops"></div>
<div id="blop8" class="blops"></div>
<div id="blop9" class="blops"></div>
<div id="blop10" class="blops"></div>
<div id="char"></div>
</body>
</html>
Raw
popcode.json
{"enabledLibraries":["jquery"]}
Raw
script.js
var random = (Math.floor((Math.random() * 100) + 1)) + "%";
var score = 0;
setInterval(function(){
for(var count = 1; count < 11; count = count + 1){
var charTop = $("#char").offset().top;
var charLeft = $("#char").offset().left;
var charRight = charLeft + $("#char").width();
var blopsBot = $("#blop"+count).offset().top + $("#blop"+count).height;
var blopsLeft = $("#blop"+count).offset().left;
var blopsRight = $("#blop"+count).offset().left + 20;
$("#blop"+count).css("top", $("#blop"+count).offset().top + 1);
if (blopsBot > charTop+70) {
$("#blop"+count).css('top', 0);
$("#blop"+count).css('left', Math.floor(Math.random() * 580));
}
else if (blopsBot > charTop && (blopsLeft >= charLeft && blopsRight <= charRight)) {
$("#blop"+count).css('top',0);
$("#blop"+count).css('left', Math.floor(Math.random() * 580));
score += 1;
}
}
},1);
for(var count = 1; count < 11; count = count + 1){
$("#blop"+count).css("top", -125 * count);
$("#blop"+count).css("left",Math.floor(Math.random() * 580));
}
$("body").keydown(function(event) {
if (event.which === 37) {
$("#char").css("left", $("#char").offset().left - 15);
} else if (event.which === 39) {
$("#char").css("left", $("#char").offset().left + 15);
} else {
return;
}
});
Raw
styles.css
.blops {
width: 20px;
height: 20px;
background-color: salmon;
position: absolute;
}
#char {
width: 50px;
height: 50px;
background-color: yellow;
position: absolute;
top: 85%;
left: 50%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment