Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Economics & Finance
A notification icon is a common UI feature in modern web applications that displays the count of pending notifications. This feature can be implemented using HTML, CSS, JavaScript, and Bootstrap to create an interactive notification system with a badge counter. Required CDN Links To build this notification counter, we need to include the following CDN links in our HTML document − Font Awesome CDN Bootstrap CDN HTML Structure The notification icon consists of a button with a bell icon and a badge counter. The notifications ... Read More
HTML tables sometimes appear with inconsistent layouts due to automatic cell sizing and content distribution. The key to preventing "wrong" table formatting lies in using proper CSS properties like table-layout: fixed, explicit width and height specifications, and consistent border styling. This article will teach you how to prevent tables from formatting incorrectly in HTML by using CSS to control table dimensions, cell spacing, and layout behavior. HTML Table Basics HTML tables are created using the element with for table rows and for data cells. By default, tables use automatic layout where column widths are ... Read More
The HTML DOM Input Range step property is used to set or return the step attribute value of a range slider control. It specifies the increment value for each movement of the slider. By combining the step property with min and max attributes, you can define precise intervals for legal values within the range. Syntax Following is the syntax for setting the step property − rangeObject.step = number Following is the syntax for returning the step property − rangeObject.step Parameters The step property accepts the following parameter − ... Read More
The onblur event attribute in HTML is triggered when an element loses focus. This commonly occurs when a user clicks away from an input field, button, or other focusable element, or when they press the Tab key to navigate to another element. Syntax Following is the syntax for the onblur event attribute − Content The script parameter contains JavaScript code that executes when the element loses focus. Common Use Cases The onblur event is commonly used in the following scenarios − Form validation − Validate input fields when users move ... Read More
The HTML Window self property returns a reference to the current window object. It is essentially the same as the global window object and is commonly used to check if the current window is the topmost window or if it's embedded within a frame or iframe. Syntax Following is the syntax for accessing the window self property − window.self The window.self property returns the window object itself, making it equivalent to simply using window. Return Value The window.self property returns the current window object reference. Common Use Cases The window ... Read More
The onclick event attribute in HTML is triggered when a user clicks on an HTML element. It allows you to execute JavaScript code in response to mouse clicks, making web pages interactive and dynamic. Syntax Following is the syntax for the onclick event attribute − Content Where script can be either a JavaScript function call or inline JavaScript code that executes when the element is clicked. Basic Example Following example demonstrates a simple onclick event that displays an alert message − Basic onclick Example ... Read More
The HTML Window sessionStorage property allows us to store key/value pairs data in a web browser for one session only. The data is automatically deleted when the browser tab is closed, making it perfect for temporary data storage during a user's visit. The sessionStorage is part of the Web Storage API and provides a way to store data locally within the user's browser with session-level persistence. Unlike localStorage, sessionStorage data does not persist across browser sessions. Syntax Following is the syntax to access the sessionStorage object − window.sessionStorage SessionStorage Methods The sessionStorage ... Read More
Adding and removing values on click events allows you to create dynamic, interactive web pages. This functionality is achieved using JavaScript event handlers that respond to user interactions, enabling you to manipulate DOM elements in real-time when users click on specific elements. The most common approach involves using JavaScript's addEventListener() method to attach click events and the remove() method to delete elements from the DOM. Syntax Following is the syntax for adding click event listeners − element.addEventListener('click', functionName); Following is the syntax for removing elements − element.remove(); Adding Values ... Read More
The HTML DOM exitFullscreen() method is used to exit fullscreen mode for an element that is currently displayed in fullscreen. This method is called on the document object, not on individual elements, and it returns a Promise that resolves when the element has exited fullscreen mode. Syntax Following is the syntax for the exitFullscreen() method − document.exitFullscreen() Return Value The method returns a Promise that resolves to undefined when fullscreen mode is successfully exited. The Promise may be rejected if an error occurs during the exit process. How It Works The ... Read More
The HTML DOM Input Range stepDown() method is used to decrement the value of a range slider by a specified amount. If no parameter is provided, it decrements by 1. When the step attribute is defined on the range input, the stepDown() method decrements in multiples of that step value. Syntax Following is the syntax for the Range stepDown() method − rangeObject.stepDown(number) Parameters The method accepts the following parameter − number − An optional numeric parameter specifying how many steps to decrement. If omitted, defaults to 1. How It ... Read More