Skip to content

README.md

Latest commit

 

History

History
39 lines (25 loc) · 1.3 KB

README.md

File metadata and controls

39 lines (25 loc) · 1.3 KB
summary Use Javascript keyboard events so that when a key is pressed a circle shows up randomly on the screen.
time 1 hour
deliverables 1 HTML file, 1 CSS file, 1 JS file

Circle maker

Overview

  • Fork this repository.
  • Write an event listener in Javascript that listens for keydown
  • When the event is triggered create a brand new <div>
  • Generate a random left and top coordinate for the <div> using Math.random()
  • Place the <div> on the page in the random position.
  • Run it through Markbot and make sure it passes all the checks.

Goal

Create the interaction shown in the linked video.

Hand in

Drop this folder into your Markbot application. Make sure to fix all the errors. And submit online.

Optional challenges

These challenges are here if you’d like to try a little more work—they are for extra experience and learning. They are completely optional and not graded. Show them to me if you’d like—I’d love to see them.

  1. When a new circle is added make its background-color randomized.
    Watch this video to see how it interacts.