Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
Javascript Articles
Page 481 of 534
How to draw on scroll using JavaScript and SVG?
To draw on scroll using JavaScript and SVG, the code is as follows −Example Live Demo body { height: 2000px; background: #f1f1f1; } svg { position: fixed; top: 15%; width: 400px; height: 210px; margin-left: -50px; } Scroll Using JavaScript and SVG example var polygon = document.getElementById("polygon"); var length = polygon.getTotalLength(); polygon.style.strokeDasharray = length; polygon.style.strokeDashoffset = length; window.addEventListener("scroll", drawPoly); function ...
Read MoreHow to make a fullscreen window with JavaScript?
To create a fullscreen window with JavaScript, the code is as follows −Example Live Demo body{ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } button{ display: block; padding:10px; margin:10px; background-color: rgb(81, 0, 128); border:none; color:white; } Fullscreen Window with JavaScript Example
Read MoreJavaScript DataView()
The JavaScript DataView allows us for reading and writing in multiple number types in binary ArrayBuffer by providing a low level interface. We cannot manipulate ArrayBuffer directly without using DataView().Following is the code for implementing JavaScript DataView −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample { font-size: 20px; font-weight: 500; } JavaScript DataView() CLICK HERE Click on the above button to change the array buffer contents using DataView() ...
Read MoreJavaScript Cursor property
The cursor property is sets or returns the cursor type that will be displayed for the cursor property.Following is the code for implementing JavaScript Cursor property −Example Live Demo body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } JavaScript Cursor property Hover the mouse over the above paragraph after clicking the below button Change Cursor let sampleEle = document.querySelector(".sample"); document.querySelector(".Btn").addEventListener("click", () => { sampleEle.style.cursor = "crosshair"; }); OutputOn clicking the “Change Cursor” button −
Read MoreJavaScript Error name Property
The error name property is used for setting or getting the name of the error.Following is the code for the Error name property −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample { font-size: 18px; font-weight: 500; } JavaScript Error name Property CLICK HERE Click on the above buttons to see the error name let sampleEle = document.querySelector(".sample"); document.querySelector(".Btn").addEventListener("click", () => { try { confrm("Are you sure"); } catch (e) { sampleEle.innerHTML = "Error: " + e.name; } }); OutputOn clicking the “CLICK HERE” button −
Read MoreJavaScript Error message Property
The error message property sets or returns an error message in JavaScript. Following is the code for the error message property −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample { font-size: 18px; font-weight: 500; } JavaScript Error message Property CLICK HERE Click on the above buttons to see the error message let sampleEle = document.querySelector(".sample"); document.querySelector(".Btn").addEventListener("click", () => { try { confrm('Are you sure'); } catch (e) { sampleEle.innerHTML = "Error: " + e.message; } }); OutputOn clicking the “CLICK HERE” button −
Read MoreJavaScript encodeURI(), decodeURI() and its components functions
The encodeURI() function encodes the complete URI including special characters except except (, / ? : @ & = + $ #) characters.The encodeURIComponent() function encodes some parts of the URI by basically encoding the special characters. It also encodes the following characters − (, / ? : @ & = + $ # )The decodeURI() function decodes the URI generated by the encodeURI() function.The decodeURIComponent() function is used to decode some parts of URI generated by encodeURIComponent().Following is the code for the encodeURI(), decodeURI() and its component functions −Example Live Demo Document body { ...
Read MoreJavaScript – Getting Coordinates of mouse
To get the coordinates of mouse using JavaScript, the code is as follows −Example Live Demo body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample { font-size: 25px; font-weight: 500; } Coordinates of mouse Hover the mouse over the screen to get its x and y axis position let sampleEle = document.querySelector(".sample"); document.body.addEventListener("mousemove", (event) => { sampleEle.innerHTML = "X axis: " + event.x + " Y axis: " + event.y; }); OutputThe above code will produce the following output:
Read MoreJavaScript Const
The JavaScript const declarations create variables that cannot be reassigned to some other value or redeclared later. It was introduced in ES2015.Following is the code for JavaScript const declaration −Example Live Demo body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } Const example CLICK HERE Click the above button to try changing const value let sampleEle = document.querySelector(".sample"); const a = 33; sampleEle.innerHTML = "a = " + a + ""; document.querySelector(".Btn").addEventListener("click", () => { try { a = 44; } catch (err) { sampleEle.innerHTML += "Error : " + err; } }); OutputOn clicking the ‘CLICK HERE’ button to change constant value −
Read MoreJavaScript Auto-filling one field same as other
To auto-filling one field same as other, the JavaScript script is as follows −Example Live Demo body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } JavaScript Auto-filling one field same as other Enter your primary address Address Pin Code Secondary Address same as primary Same Address Enter your secondary address Address Pin Code let checkEle = document.querySelector(".check"); let addressEle = document.querySelectorAll(".address"); let pinCodeEle = document.querySelectorAll(".pincode"); checkEle.addEventListener("change", (event) => { if (event.target.checked) { console.log(addressEle[0].value); addressEle[1].value = addressEle[0].value; pinCodeEle[1].value = pinCodeEle[0].value; } }); OutputOn filling the primary address and clicking the “Same Address” checkbox −
Read More