Simon’s second set of Web Development How To’s: How to make a Calendar and How to make Buttons

Simon’s new series of web development tutorials: two new playlists How to make a Calendar and How to make Buttons:

 

 

Advertisements

Simon’s Plinko

 

Simon loved Daniel Shiffman’s simulation of the Plinko game and added some extra features to Daniel’s code, like a button to make new chips appear. He also saw a television version of Plinko where people were trying to win money, so he added the figures below to indicate your score.

Simon put this project on GitHub, too!

Code: https://github.com/simon-tiger/plinko

Direct link to the game: https://simon-tiger.github.io/plinko/

You can also both the code and play with the animation via the p5.js web editor (hit Download to get the animation on your computer): http://alpha.editor.p5js.org/simontiger/sketches/Sk23OkW6x

Simon’s Search Engine, Sort Table and Self-Made Arrows

Simon is a big fan of w3schools.com and has been using their w3.js library for these exercises. In the first video he shows a sort table he made. By pressing the arrows the places listed are put in alphabetical order. he borrowed the text from w3schools and drew the arrows and the background himself in Microsoft Paint.

He also buit a search engine:

Search engine:

w3-js-22-jan-2017-2-filter-list-kopiew3-js-22-jan-2017-4-filter-table-kopie

A sort list. Before the “Sort” button is pressed:

w3-js-22-jan-2017-5-sort-list-kopie

After the button is pressed:

w3-js-22-jan-2017-6-sort-list-kopie

Toggling classes:

w3-js-22-jan-2017-1-toggle-class-kopie

Adding classes:

w3-js-21-jan-2017-5-add-classes-kopie

Adding colour to id:

w3-js-21-jan-2017-3-add-style-kopie

Adding class:

w3-js-21-jan-2017-3-add-class-kopie

Hiding and showing elements:

w3-js-21-jan-2017-1-hide-and-show-kopie

w3-js-22-jan-2017-3-filter-list-kopie

 

w3-js-21-jan-2017-2-hide-and-show-kopie