Training Guide: Programming in HTML5 with JavaScript and CSS3 Ebook

Lesson 2: Dragging and dropping files CHAPTER 13 519 FIGURE 13-5 The webpage with style rules applied To process the dropped fil ...

520 CHAPTER 13 Drag and drop /// <reference path="jquery-1.8.3.js" /> $(document).ready(function () { jQuery.event.props.p ...

Lesson 2: Dragging and dropping files CHAPTER 13 521 FILE 13-6 he completed webpage after files were dragged and droppedT Quick ...

522 CHAPTER 13 Drag and drop To which events do you need to subscribe to program file drag and drop? (Choose all that apply.) A ...

Practice exercises CHAPTER 13 523 Add a reference to the jQuery library by right-clicking the project node and choosing Manage ...

524 CHAPTER 13 Drag and drop #gameBoard { width: 345px; height: 345px; margin-right: auto; margin-left: auto; } #message { backg ...

Practice exercises CHAPTER 13 525 These functions are created next. Your code should look like the following. /// <reference ...

526 CHAPTER 13 Drag and drop In Solution Explorer, right-click the default.html file and choose Set As Start Page. Test your wo ...

Practice exercises CHAPTER 13 527 $('#gameBoard').on('dragover', preventDefault); $('#gameBoard').on('drop', drop); }); At the ...

528 CHAPTER 13 Drag and drop Your code should look like the following. function drop(e) { var $square= $(e.target); if ($square. ...

Practice exercises CHAPTER 13 529 $('#gameBoard').on('dragenter', preventDefault); $('#gameBoard').on('dragover', preventDefault ...

530 CHAPTER 13 Drag and drop } function swapTileAndEmptySquare(sourceLocation) { var $draggedItem = $('#square' + sourceLocation ...

Practice exercises CHAPTER 13 531 $(document).ready(function () { jQuery.event.props.push('dataTransfer'); createBoard(); addTil ...

532 CHAPTER 13 Drag and drop checkForWinner(); } } At the bottom of the default.js file, add a checkForWinner function. In this ...

Practice exercises CHAPTER 13 533 function dragStarted(e) { var $tile = $(e.target) $tile.addClass('dragged'); var sourceLocatio ...

534 CHAPTER 13 Drag and drop } else { var row = Math.floor(emptySquare / 4) if (row == 0 || (random < 0.75 && row != ...

Suggested practice exercises CHAPTER 13 535 Suggested practice exercises The following additional exercises are designed to give ...

536 CHAPTER 13 Drag and drop Answers This section contains the answers to the lesson review questions in this chapter. Lesson 1 ...

Answers CHAPTER 13 537 Lesson 2 Correct answers: D, E, and G A. Incorrect: No dragstart event is associated with dragging files ...

...