Skip to content

Instantly share code, notes, and snippets.

@ericmustin
Created October 18, 2016 04:39
Show Gist options
  • Save ericmustin/b8e09e38557b60cdcaa70bf02d0f3908 to your computer and use it in GitHub Desktop.
Save ericmustin/b8e09e38557b60cdcaa70bf02d0f3908 to your computer and use it in GitHub Desktop.
eating_a_mango
<!DOCTYPE html>
<meta charset="utf-8">
<style>
#box {
height: 226px;
width: 173px;
position: absolute;
background: url("https://s11.postimg.org/v3trip237/picturetest_Update.png");
background-size: 1104px 226px;
background-position: 0px 0px;
}
</style>
<head>
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha256-/SIrNqv8h6QGKDuNoLGA4iret+kyesCkHGzVUUV0shc=" crossorigin="anonymous"></script>
</head>
<body>
<div id="box">
</div>
<script>
$(function(){
var box = $("#box");
var i = 0;
function testProgram() {
var backgroundXPosition = {
0: "0px",
1: "-173px",
2: "-386px",
3: "-564px",
4: "-777px",
5: "-932px"
};
var currentPosition = i++ % 6;
console.log(currentPosition);
box.css('background-position',backgroundXPosition[currentPosition]+" 0px");
}
setInterval(testProgram, 400);
});
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment