Latest Tutorials and How-To's

javascript

How to Check if Cookies are Enabled or Disabled

Without cookies being enabled in the browser, some web applications may not work as expected. To prevent such cases navigator.cookieEnabled property can be used to do a prior check whether cookies are enabled or not.
January 5, 2020
javascript

Checking for a Secure Context Before Running User Sensitive Code

Browsers allow user-sensitive and low-level web APIs to execute only when the page is in a secure context. In addition, the window.isSecureContext property can be used to check whether the current environment is safe or not.
January 2, 2020
videos

CSS Updates - New Properties for Styling Text Decorations & Underlines (VIDEO)

The new CSS properties such as text-decoration-thickness, text-decoration-color etc can help in creating attractive text decorations and underlines, which were not possible before.
January 1, 2020
html

How to Prevent Sending the Referring URL when Clicking a Link

The referring url may compromise user privacy when a link is clicked. However this can be prevented through the referrer meta tag, or using the referrerpolicy attribute on hyperlinks.
December 29, 2019
ui-ux

How to Create a Dark / Light Mode for Websites

Giving user the preference of choosing a dark or light mode has become a very popular feature of operating systems. Webpages can also be shown in dark or light theme depending on the mode chosen in the device settings.
December 28, 2019
html

Tracking Clicked Links using ping Attribute of〈a〉Tag

The ping attribute can be included in link tags to notify the server when the link is clicked. This can be used for tracking purposes.
December 26, 2019
html

HTML〈output〉Tag - Representing Output of a Performed Calculation or User Action

The 〈output〉 tag is the standard HTML element in which the result of any user action or calculation performed can be shown. The result can inserted inside the tag using Javascript.
December 25, 2019
html

How to Lazy Load HTML Videos

HTML videos can be lazily loaded using the preload attribute of the 〈video〉element. preload="none" needs to be set to disable pre-loading of the video.
December 24, 2019
videos

An Introduction to Variable Fonts and Using Them in Webpages (VIDEO)

Variable fonts is a new font technology that allows a single font file to store multiple variations of the font. Variable fonts are going to bring a major change in web design.
December 22, 2019
javascript

Filling an Array with a Given Value in Javascript

The Array.fill() method can be used to fill an array with a specific value, starting from a given index and ending upto another index.
December 21, 2019
javascript

Flatten Array Containing Arrays in JavaScript

Flattening an array refers to the process taking an input array, which may itself contain n-dimensional arrays as its elements, to a single array. This can be done in Javascript using the flat() method.
December 19, 2019
javascript

Format Number as Currency in Javascript

The Intl.NumberFormat object can be used to format a number as a currency using Javascript. Various options can be set to customize format of currency code, comma / decimal separators etc.
December 18, 2019
javascript

Knowing whether Promise is Completed (either Fulfilled or Rejected) with finally() Callback

The finally() callback can be used to know whether the Promise was settled. We don't care whether it was resolved or rejected.
December 17, 2019
javascript

Setting Default Values to Variables if null or undefined (using ES2020 Nullish Coalescing Operator)

The nullish coalescing operator has been newly introduced in Javascript. This can be used to give default values if a variable is either null or undefined.
December 16, 2019
javascript

What Happens to setTimeout() / setInterval() Timers Running on Inactive Browser Tabs ?

Time delay for setTimeout() / setInterval() methods executing on inactive browser tabs are set to one second regardless of their value defined in code.
December 15, 2019
ui-ux

How to Disable Page Scrolling when Modal Dialog is Opened

When a fixed-position modal dialog is opened, scrollbars on the page can be removed by dynamically setting overflow:hidden CSS for the 〈body〉tag.
December 14, 2019
css

Disabling Pull-to-Refresh Feature on Mobile Browsers using CSS

Pull-to-refresh feature on mobile browsers that refreshes the page, can be disabled using the overflow-behaviour CSS property.
December 13, 2019
html

Synchronous / Asynchronous Image Decode using〈img decoding〉Attribute

The "decoding" attribute can be included for an 〈img〉tag to specify whether to decode the image in parallel or along with the rest of the page content.
December 12, 2019
javascript

Preventing Addition of New Properties to a Javascript Object with Object.seal()

The Object.seal() method seals an object. After an object gets sealed, no new properties can be added to it.
December 11, 2019
javascript

Preventing Changes to a Javascript Object with Object.freeze()

The Object.freeze() method can make an object or array immutable. No changes can be made to that object once it gets immutable.
December 10, 2019