I'm a beginner in the realm of Javascript, and I've recently tried my hand at creating a simple classic snake game. Instead of using complex graphics, I opted for a more HTML/CSS approach where each pixel on the map is represented by a div box, and the snake's movements are depicted through background color changes using CSS animations.
You can check out my version of the game on CodePen here.
Currently, I am facing some issues with the game:
*Rare - sometimes the berry spawns on the snake's body, which shouldn't happen.
*Extremely rare - occasionally the snake dies unexpectedly when it gets longer.
There might be other issues that have slipped under my radar.
I would greatly appreciate any help, feedback, or suggestions regarding optimization or any unnecessary/overcomplicated code snippets.
//PAINT MAP
function paintMap() {
var i = 1;
while (i < 101){
$('.map').append('<div class="box" id="loadID""></div>');
$("#loadID").attr("id", i);
i++;
}
console.log("Map loaded and starting move engine");
moveEngine();
}Thank you for taking the time to review my code and provide valuable insights and assistance!