html5简单拼图游戏,HTML5拼图游戏

拼图游戏介绍

拼图游戏将一幅图片分割成若干拼块并将它们随机打乱顺序。当将所有拼块都放回原位置时，就完成了拼图(游戏结束)。

在“游戏”中，单击滑块选择游戏难易，“容易”为3行3列拼图游戏，中间为一个4行4列拼图游戏，“难”为5行5列拼图游戏。拼块以随机顺序排列，玩家用鼠标单击空白块的四周来交换它们的位置，直到所有拼块都回到原位置。拼图游戏运行结果如图所示。

sliding.js代码:

var img = new Image();

img.src = 'defa.jpg';

img.addEventListener('load',drawTiles,false);

var boardSize = document.getElementById('puzzle').width;

var tileCount = document.getElementById('scale').value;

var titleSize = boardSize / tileCount;

var clickLoc = ne