Playground

Choose wisely:

Show!!

• Dinosaurs
  14/12/23

  Experiments with a big array of objects

• Event Delegation
  13/03/23

  A technique where you have multiple elements that need eventListeners

• GMT 01
  11/03/23

  Just trying out some code from the Go Make Things academy.

• Accordion Code
  11/03/23

  The code for a simple accordion by Chris Fernandi is simple but interesting.

• Input Range
  11/03/23

  Using the input type=“range” form element to change things

• Add CSS to an iframe
  28/02/22

  How to add CSS to an iframe with JS

• Clock
  25/02/22

  A CSS and JS clock from the Wes Bos JavaScript 30 course

• FAQ
  20/02/22

  Two ways to make an FAQ drop down list.

• Review Carousel
  18/02/22

  Making a carousel of user reviews

• Counter
  17/02/22

  Simple counter project

• localStorage() and Target
  03/02/22

  Saving to localStorage using target value

• Background Image
  01/02/22

  App to experiment with background colours, images and blend modes. Add any image …

• Color Picker
  01/02/22

  Tool to help choose background colours on the page.

• Full screen map
  31/01/22

  Trying out making a map that expands

• Zoom Effect
  30/01/22

  The final project in the Florin Pop series. How it works Most of this is done …

• Soundboard
  29/01/22

  Florian Pop mini project no. 9 How it works The audio is added to the HTML using …

• Image Carousel
  28/01/22

  Florin Pop’s mini project no. 10 Next auto (coming soon) What’s …

• Dark Mode Toggle
  28/01/22

  See the button in the top left corner. Another from the Florin Pop video The HTML …

• Background Changer
  28/01/22

  Change background Changes the background to an hsl a random colour where the …

• Purple Hearts
  27/01/22

  Start Stop This is another Florin Pop mini project where he makes 10 JS projects …

• Type Out Text
  27/01/22

  The typewriter effect with JS

• Toaster Notification
  27/01/22

  So this is based upon a video by Florin Pop which he plans out as: floating toast …

• Gradient Generator
  25/01/22

  Generates a unique gradient every two seconds, most of which have never been seen …

• Various 2
  21/01/22

  A simple modal or popup, using keys with keydown to trigger events, using the …

• Async and Defer
  19/01/22

  Testing out async and defer from a script in the head section.

• Test 3
  10/01/22

  Changing background and page styles. Order of execution. Blend modes.

• James Bond
  06/01/22

  How many films? jamesBondFilms.length stored in a variable. array test? …

• Various 1
  31/12/21

  Reactivity The button has innerHTML including the counter which increase by one …

• More Loops
  29/12/21

  Looping of objects.

• For Loop Practice
  29/12/21

  Using for for…of and forEach loops to create lists on the page.

• Logic Practice
  28/12/21

  If statements and the ternery operator.

• Event Target
  28/12/21

  Demonstrations of how event.target works.

• Choose Colour
  28/12/21

  Change the color of an element to any CSS colour using prompt.

• HTML 2
  26/12/21

  Some more experiments with DOM manipulation.

• Arrays
  25/12/21

  Experimenting with different array methods such as unshift, pop, push and some …

• Tester
  06/06/21

  Some experiments from W3 schools JS course.

• Confirm
  03/08/20

  Confirm boxes are the third dialogue box after alert() and prompt(). They return a …

• Date
  03/08/20

  Today’s date is used by running the function today() when the page loads: …

• Scope
  03/08/20

  Testing scope and typeof These don't work because the prompt seems to save every …

• HTML 1
  30/07/20

  DOM manipulation and looping through arrays.

• Random nos
  30/07/20

  The built in Math.random() method generates a random number between 0 and …

• Hamburger Icon
  29/07/20

  Creating an animated hamburger item for responsive sites.

• Test
  29/07/20

  Getting buttons working Use onclick with a function.(lower case) define a …