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
-
Economics & Finance
Articles by Tarun Singh
Page 3 of 9
How to create an Asynchronous function in JavaScript?
A JavaScript asynchronous function is a function that runs independently of the main flow of the program. This allows the program to continue executing other code while the async function is running. The async keyword is used to declare an async function, and await is used to pause the execution until a specific asynchronous task is completed. Methods to Create Asynchronous Functions Using async/await Keywords The simplest way to create an asynchronous function is to use the async keyword before the function declaration. Syntax async function fetchData() { const response = ...
Read MoreHow can a page be forced to load another page in JavaScript?
In JavaScript, you can force a page to load another page using the window.location object. This object provides three main approaches: window.location.href property, window.location.assign() method, and window.location.replace() method. Each handles browser history differently, making them suitable for different use cases. Using window.location.href The window.location.href property contains the current URL and can redirect users to a new page. This is the most commonly used method for page redirection. Syntax window.location.href = "new_url"; You can also use setTimeout() to redirect after a delay: Delayed Redirect Example ...
Read MoreHow to create an array of partial objects from another array in JavaScript?
Arrays are one of the most commonly used data types in JavaScript. They are used to store collections of data and allow for efficient access and manipulation of data. Arrays can contain any type of data, including primitive values, objects, and even other arrays. The technique of creating an array of partial objects from an array is a valuable technique when dealing with complex data sets. Partial objects contain only a subset of the data from the original array, allowing us to focus on a particular set of data. This can be especially useful when dealing with large data ...
Read MoreHow to create an array with random values with the help of JavaScript?
In JavaScript, creating arrays filled with random values is a common requirement for simulations, games, and testing. The Math.random() method generates random numbers between 0 (inclusive) and 1 (exclusive), which can be combined with various array methods to create arrays of random values. Using Math.random() with For Loop The most straightforward approach uses a for loop with Math.random() to populate an array: Syntax // Random decimals between 0 and 1 for (let i = 0; i < arrayLength; i++) { randomArr.push(Math.random()); } // Random integers in a range for (let ...
Read MoreHow to remove indentation from an unordered list item using CSS?
To remove indentation from an unordered list item using CSS, we can use various approaches to eliminate the default spacing that browsers apply to lists. Indentation provides visual hierarchy, but sometimes we need flat, unindented lists for specific designs. Syntax ul { padding-left: 0; list-style-type: none; } Method 1: Using padding Property The most common approach uses the CSS padding property to remove the default left padding that browsers apply to unordered lists − .no-indent { ...
Read MoreHow to rotate shape loader animation using CSS?
In this article, we'll see how to rotate shape loader animation using CSS. Loading animations of different shapes is an essential part of a web app as it helps users stay engaged while they wait for a website to load. One popular type is the rotating shape loader, where a shape spins continuously until the web page is fully loaded. Moving ahead, we are going to use different approaches to rotate shape loader animations with various examples. Syntax .loader { animation: rotation duration timing-function iteration-count; } @keyframes rotation { ...
Read MoreHow to use a not:first-child selector in CSS?
The CSS :not(:first-child) selector combines the :not and :first-child pseudo-classes to select all elements except the first child of their parent. This is useful when you want to style all child elements except the first one. Syntax element:not(:first-child) { /* CSS styles */ } Method 1: Selecting Specific Child Elements You can target specific elements within a parent container, excluding the first one − div p:not(:first-child) { color: green; ...
Read MoreHow to translate an image or icon by hovering over it?
In web development, interactivity is key to providing a memorable user experience. One common technique used to add interactivity is hovering over images or icons to reveal more information or change the appearance. Translating an image or icon by hovering over it is a great way to add some movement and interest to your website. In this article, we will learn how to translate an image or icon on hover. To perform this task, we will learn different approaches using only HTML and CSS. Syntax selector { transform: translateX(value) | translateY(value) | ...
Read MoreHow to transform child elements preserve the 3D transformations?
When working with 3D transformations in CSS, preserving the 3D context for child elements requires specific techniques. The transform-style property controls whether child elements are rendered in 3D space or flattened to a 2D plane. Syntax selector { transform-style: preserve-3d | flat; } Method 1: Using Transform-style Property The transform-style: preserve-3d property allows child elements to maintain their 3D positioning when the parent has 3D transforms applied − .container { perspective: 800px; ...
Read MoreHow to test CSS property of an element using Protractor?
Testing CSS properties is crucial in ensuring the quality of a web application. CSS properties determine how elements are displayed on a webpage, such as font size, color, and layout. Protractor is a popular end-to-end testing framework that uses WebDriver to automate interactions between a web application and a browser, widely used to test Angular applications. In this article, we will learn how to test the CSS properties of an element with the help of Protractor using different methods. Prerequisites Installation Requirements: Install Protractor: npm install -g protractor Update binaries: webdriver-manager update Start server: webdriver-manager ...
Read More