cards 2

by Ron Eaglin

HTML

<input type="button" value="Deal Card" id="deal" />
<br/>
<br/>
<br/>
<div id='drop' class='drop'>Trash</div>

<!--LINK JQUERY-->
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<!--PERSONAL SCRIPT JavaScript-->
<script type="text/javascript">
   $(function(){
      alert("Welcome to the simple card game!");
   });
</script>

<body>
<script>
$(init);

function init() {
  $('.drop').droppable({
    drop: handleDropEvent
  });
}

$('#deal').click(function() {
  dealCard(randomCard());
});

var cardsInDeck = new Array();
var numberOfCardsInDeck = 52;
cardsInDeck[0] = "C01";
cardsInDeck[1] = "C02";
cardsInDeck[2] = "C03";
cardsInDeck[3] = "C04";
cardsInDeck[4] = "C05";
cardsInDeck[5] = "C06";
cardsInDeck[6] = "C07";
cardsInDeck[7] = "C08";
cardsInDeck[8] = "C09";
cardsInDeck[9] = "C10";
cardsInDeck[10] = "C11";
cardsInDeck[11] = "C12";
cardsInDeck[12] = "C13";
cardsInDeck[13] = "D01";
cardsInDeck[14] = "D02";
cardsInDeck[15] = "D03";
cardsInDeck[16] = "D04";
cardsInDeck[17] = "D05";
cardsInDeck[18] = "D06";
cardsInDeck[19] = "D07";
cardsInDeck[20] = "D08";
cardsInDeck[21] = "D09";
cardsInDeck[22] = "D10";
cardsInDeck[23] = "D11";
cardsInDeck[24] = "D12";
cardsInDeck[25] = "D13";
cardsInDeck[26] = "H01";
cardsInDeck[27] = "H02";
cardsInDeck[28] = "H03";
cardsInDeck[29] = "H04";
cardsInDeck[30] = "H05";
cardsInDeck[31] = "H06";
cardsInDeck[32] = "H07";
cardsInDeck[33] = "H08";
cardsInDeck[34] = "H09";
cardsInDeck[35] = "H10";
cardsInDeck[36] = "H11";
cardsInDeck[37] = "H12";
cardsInDeck[38] = "H13";
cardsInDeck[39] = "S01";
cardsInDeck[40] = "S02";
cardsInDeck[41] = "S03";
cardsInDeck[42] = "S04";
cardsInDeck[43] = "S05";
cardsInDeck[44] = "S06";
cardsInDeck[45] = "S07";
cardsInDeck[46] = "S08";
cardsInDeck[47] = "S09";
cardsInDeck[48] = "S10";
cardsInDeck[49] = "S11";
cardsInDeck[50] = "S12";
cardsInDeck[51] = "S13";

function dealCard(i) {
  if (numberOfCardsInDeck == 0) return false;
  var card =...

CSS

.drop {
  float: left;
  width: 160px;
  height: 200px;
  background-color: #CAD8E5;
}