GitHub Pages

You can have a website with GitHub Pages hosted directly from your GitHub repository. First thing you have to create this repository, and it will be named using your GitHub username + github.io. For example, my username in GitHub is DianaBaRo, so my GitHub Page is: https://dianabaro.github.io/.

They just allow one web page for user. What I did is create a table with links to all my different projects, a page that works as a kind of an index.

Your repository has to have an index.html. After adding folders with my projects to this repository I changed index.html to home.html and it didn’t work well, they ask you for the first one. Don’t change its name!

Solitaire Game

So, this is my first JS project, in which I am still working to implement most of the conditions with the drag and drop and make some sense according to the game rules.

I have used HTML, CSS and JS.

Here it is my HTML, where I have created a navigation bar and a structure made of divs to display the stack, the waste, the spades, hearts, diamonds and clubs piles and a second row with seven piles. In my first attempt I made a table with rows but it was much easier using divs when I started to modify everything with CSS.

Here it is my CSS code. I have had many problems trying to put the image I was dragging on top of another one. Everything has to say with their position, absolute and relative positions. The position property.

And finally, the fun part! All my little “monstruos”, aka my functions. There are some pertinent comments along the code.

WORK TO DO: ┬áI am still working in all the┬ánecessary conditions to delimit the drop function according to the rules of the game. Now, you can drag and drop everywhere, you can even pick a card that it isn’t on the top of the pile!