Welcome to a tutorial on how to create a simple Javascript stopwatch. So you need to create a simple stopwatch function for your project, your school assignment, or maybe just out of pure curiosity? Well, it is actually pretty easy. Let us walk through the exact steps in this guide – Read on! ⓘ I …
Simple Stopwatch In Pure Javascript (Free Download) Read More »
Welcome to a tutorial on how to create a simple vanilla Javascript Shopping Cart. Looking to build an eCommerce website or web app? Not too keen on the complicated bloated scripts and just need a simple interface? Well, here it is. A standalone local storage shopping cart that does not use any frameworks – Read …
Simple Javascript Shopping Cart (Free Code Download) Read More »
Welcome to a tutorial on how to show/hide HTML elements with animations. So you need to toggle the visibility of an element, but with bells-and-whistles? Here is an easy example to show/hide an HTML element with a fade effect: The HTML element – <div id=”fade”>TEXT</div> The CSS classes: #fade { transition: opacity 1s; } .hide …
Show/Hide HTML Elements With Animation (Simple Examples) Read More »
Welcome to a quick tutorial on how to make unselectable text in HTML. So you have a not-so-top-secret website that you want to protect? Stop people from highlighting and copying the text? There are 2 common ways to create unselectable text: In CSS, simply add the user-select: none property. In Javascript, document.getElementById(“TARGET”).onselectstart = () => …
Unselectable Text In HTML & JS (Very Simple Examples) Read More »
Welcome to a tutorial on how to create an editable HTML table. Well, creating an editable table is quite literally adding a contentEditable property into the cell <td> on a double click. But it still requires quite some bits of code – Read on for an example! ⓘ I have included a zip file with …
Welcome to a tutorial on how to abort Javascript execution. Need to manually stop a piece of script for some reason? Client-side Javascript does not have a native abort function, but there are various alternatives to abort Javascript execution: In a function, simply return false or undefined. Manually throw new Error(“ERROR”) in a function. Set …
6 Ways To Abort Javascript Execution (Simple Examples) Read More »
Welcome to a quick tutorial on how to create a simple Javascript grocery list. Ah yes, this is a classic school assignment that has never changed for decades. There are probably a ton of these on the Internet already, so I figured to create one that is “updated” – A grocery list progressive web app …
Simple Offline Javascript Grocery List PWA (Free Download) Read More »
Welcome to a quick tutorial on how to do Javascript injection. You may have stumbled on this “injection thing” on the Internet, and heard that plenty of people have voiced security concerns over it. In simple terms, Javascript injection happens when a user enters a piece of Javascript code into the site. It can be …
3 Ways To Do Javascript Injection (Explained For Beginners) Read More »
Welcome to a quick tutorial on how to set and get HTML data attributes in Javascript. Want to insert your own custom property or data into HTML elements? To set data attributes in HTML, we define data-KEY=”VALUE” in the start tag. E.G. <div data-color=”red”> To set data attributes in Javascript, we set the dataset property. …
Set & Get HTML Data Attributes In Javascript (Simple Examples) Read More »
Welcome to a tutorial on how to create a simple Javascript drawing app. Want to create your own “painting app”? Or want to learn more about the HTML canvas? Here’s a simple example – Read on! ⓘ I have included a zip file with all the source code at the start of this tutorial, so …
