Home > Web Front-end > JS Tutorial > body text

Building a Klondike Solitaire Game in Vanilla Javascript

Mary-Kate Olsen
Release: 2024-10-23 21:40:30
Original
898 people have browsed it

Building a Klondike Solitaire Game in Vanilla Javascript

I'm going to detail in this post my journey on creating a klondike solitaire game. As I progress I'll update the progress in this post as well:

Looking for Playing Card images

As any klondike solitaire game, you a complete deck of playing card images. As I started to look for one, I found something that I liked, they were released under LGPL license. As I progressed with my research, I found out that I had some restrictions in my game and I preferred not to, so I decided not to use the open source playing cards released under LGPL licence and to go with some public domain playing cards instead.

Implementing the top menu bar

Then I wanted to have some top menu bar, to be able to restart the game, or start a new one, and where to add new functionality, like changing the cards, saving scores and so on. Ath this stage my main requirement was to have the menu usable on desktop and mobiles.

Implementing a Preloader

A preloader is a simple progress bar that displays the progress of loading the resources. Implementing a progress bar in javascript and html is easy and it improves the player experience, because he/she will have a ui feedback when the game starts.

What is next:

  • Implementing piles and deck of piles
  • Dealing cards from the deck
  • Implementing Drag and Drops with rules
  • Checking the games state.

The above is the detailed content of Building a Klondike Solitaire Game in Vanilla Javascript. For more information, please follow other related articles on the PHP Chinese website!

source:dev.to
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!