HTML form with detectable changes and a reset button

Code Snippets, JavaScript, jQuery

Let’s create an HTML form with many different types of inputs with values and a hidden submit button and a reset button. Now, create a jQuery script that detects changes in input fields, unhides the submit and reset buttons, and hides them again if there is no...

Slides Layout

Layouts

Here is a simple responsive example with a demo and code for slide layout. You can use this as a starter template to achieve any demanding animation-heavy slides. DEMO See the Pen Slides Layout by Puneet Sharma (@webdevpuneet) on CodePen. HTML <div...

Sticky Sidebar

JavaScript, UI Components

Javascript function to make the sidebar sticky to the bottom if the content length is more than the sidebar. Also, check the demo for the same. DEMO See the Pen Sticky Sidebar by Puneet Sharma (@webdevpuneet) on CodePen. JavaScript let vw =...

How to detect if node is added or removed inside a DOM element

JavaScript

document.getElementById(“myDiv”).addEventListener(“DOMNodeInserted DOMNodeRemoved”, function(event) { console.log(“A new node has been inserted or removed.”); }); To use these events, you can bind a function to the DOMNodeInserted...

How to restrict textarea inputs to max 10 numbers in a line?

HTML, JavaScript

Here is an example of how to restrict the input of a textarea to a maximum of 10 numeric characters per line, and allow line breaks (newlines) using HTML and JavaScript, while also ensuring that the restriction works during copy-paste: HTML <textarea...