I created this game using javaScript. This introduction is a traditional html element. Most of the rest of the html elements are created and added using javaScript/DOM as you read this by using the defer attribute on some scripts. My javaScript also handles events from the buttons and cards. The object concept was used to code the deck and cards. The cards are moved between the columns with the HTML5 drag and drop feature.
The object of Spider is to clear all of the cards off of the playing field. To do this, a king must be on the bottom and built down to an ace. Suit and color don't matter. This completed column will then disappear.
Goal: Build cards down on the tableau from king to ace, regardless of suit. Each completed set is automatically removed from the tableau when the king is placed in an empty column. You win when all cards are removed.
Setup: The game begins with ten tableau columns; the first four columns contain six cards, and the next six columns contain five cards. The topmost card of each column is face up, the rest are face down.
How to Play: You can build tableau columns down from king to ace, regardless of suit or color. Kings cannot be played on an ace. Each column can hold a maximum of twenty-five cards. Single cards at the bottom of each column and the TOP card of a packed set can be moved between columns IF the set ends at the bottom of a column. Empty columns can be filled with single or fully packed cards. Fully packed cards are a complete or partial set of cards in descending order such as king, queen, jack or 7, 6, 5, 4. The packed cards must end at the bottom of the the column to be movable. So, if you push the deck image and deal cards, if a card out of sequence is dealt on the packed cards, the packed cards are locked into place until you remove the out of sequence card.
When play comes to a standstill, click the stock pile to place a row of ten cards on the tableau, one to each column.
When a set is completed within a column (descending from king to ace), it is automatically removed from the tableau when the king is placed in an empty column.