Training Guide: Programming in HTML5 with JavaScript and CSS3 Ebook

(Nora) #1

534 CHAPTER 13 Drag and drop


}
else {
var row = Math.floor(emptySquare / 4)
if (row == 0 || (random < 0.75 && row != 3)) {
sourceLocation = emptySquare + 4;
}
else {
sourceLocation = emptySquare - 4;
}
}
swapTileAndEmptySquare(sourceLocation);
}
}

function checkForWinner() {
if (emptySquare != squareCount - 1) return;
for (var i = 0; i < emptySquare; i++) {
if ($('#tile' + i).parent().attr('id') != 'square' + i) return;
}
$('#message').html('Winner!');
}


  1. Test your work by pressing F5 to run the website.
    When the page is displayed, the tiles should be scrambled. You should be able to move
    the tiles by dragging and dropping a tile to the empty space. When you have finished
    sorting the tiles, you should see the winning message as shown in Figure 13-9.


FIGURE 13-9 he rendered number scramble page after winningT
Free download pdf