-
Book Overview & Buying
-
Table Of Contents
Advanced JavaScript
By :
You want to make a web app that controls your home's smart LED light system. You have three LEDs that can be individually turned on or off, or all toggled together. You must build a simple HTML and jQuery interface that shows the on state of the lights. It must also have buttons to control the lights.
To utilize jQuery to build a functioning application, follow these steps:
Create a directory for the activity and in that directory, in the command prompt, run npm run init to set up package.json.
Run npm install jquery -s to install jQuery.
Create an HTML file for the activity and give the HTML block a body.
Add a style block.
Add a div to hold all of the buttons and lights.
Add a script tag with the source to the jQuery file.
<script src="./node_modules/jquery/dist/jquery.js"></script>
Add a script tag to hold the main JavaScript code.
Add a light class to the CSS style sheet with the following settings:
Width...
Change the font size
Change margin width
Change background colour