JavaScript Examples
The best way to improve your ability in any programming language is to study examples. You wouldn't try and learn to write a foreign language without also reading a lot of examples written in that language. Programming is no different.
So with that in mind, these examples document and describe the operation of some JavaScript programs in detail. Of course, the good thing about these JavaScript examples, is that you can actually see them working directly in this web site. Usually, the examples are programs that I've written because I needed the functionality for my own pages or for various teaching purposes. Each example will start with the program used in context and then go on to describe how it's put together and how it works.
Although it is usually good practice to minimize your scripts, removing comments and unnecessary white space, I have not adopted this approach here. Because I hope you will learn from these examples I have also included extensive comments throughout.
Hangman Game
The hangman game is a classic word game. This example works through the design process and a stage by stage implementation so it is easy to see the thinking behind the design and how the application develops.
Details here
Logic Circuit Simulation
This application simulates the operation of a logic circuit to control a seven segment LED. It contains a lot of discussion of the architecture of the solution so, although it's a relatively complex program, it's a good example of how to design and structure an application.
Details here
Web Animations
The next few examples are more focussed on using JavaScript for web effects, in particular using timers to trigger actions in a page.
Animating Background Colour Fade
This example uses timers to fade the background colour of a div. This is a useful introduction to the more complex use of timers and events in the slideshow discussed below.
Details here
Event-Driven Slide Show
This application is an event-driven slideshow that allows multiple slideshows to interact with each other through events attached to the frame transitions.
Details here