Javascript Articles

Page 177 of 534

How to trigger the onchange event on input type=range while dragging in Firefox?

Rushi Javiya
Rushi Javiya
Updated on 07-Mar-2023 12K+ Views

The range input allows a selection of any value between the particular range of values. Using JavaScript, we can get the input value that users have entered in the range input. The onchage event triggers only when the user releases the mouse key. So, it will not update the value while dragging the range slider. You can face this problem in all browsers, such as chrome, safari, but not only in Firefox. Users can follow the example below to check whether the input value is updated while dragging the range input. Example 1 (Input values will not update while dragging ...

Read More

How to trigger the HTML button after hitting enter button in the textbox using JavaScript?

Rushi Javiya
Rushi Javiya
Updated on 07-Mar-2023 6K+ Views

Generally, developers add the submit button to submit the input field's text. However, if they allow users to submit the input value by pressing enter, it improves the UX of the application. Here, we will learn the general way to detect the key press using the key listener event. Afterwards, we can perform any operation whenever the user presses the enter key button. Syntax Users can follow the syntax below to detect whenever the user presses the enter key. input.addEventListener("keypress", function (event) { if (event.keyCode == 13) { // enter pressed ...

Read More

How to splice an array without mutating the original Array?

Rushi Javiya
Rushi Javiya
Updated on 07-Mar-2023 4K+ Views

In JavaScript, we can use the splice() method to splice an array. The splice() method inserts or deletes single or multiple elements from the array. We can pass the starting index as the first parameter of the splice() method, from which we can insert or delete the elements. It takes the number of elements to delete from the array as a second parameter and array values as the third parameter to insert into the array. This tutorial will teach us to splice an array without mutating the original array. Mutating the original array means making changes to the array. Whenever ...

Read More

How to Create Horizontal and Vertical Tabs using JavaScript?

Rushi Javiya
Rushi Javiya
Updated on 07-Mar-2023 1K+ Views

We can create tabs using HTML, CSS & JavaScript. There can be two types of tabs. One is horizontal tabs, and another is vertical tabs. The tabs allow us to show different contents in very less space as we can show the different content according to the different tabs. We will learn to create horizontal and vertical tabs from scratch using HTML, CSS, and JavaScript. Create horizontal tabs We can show all tabs in a single row by creating horizontal tabs. Also, we can show the content of the selected tab below all tabs. Syntax Users can follow the syntax ...

Read More

How to create Hamburger Menu for mobile devices?

Rushi Javiya
Rushi Javiya
Updated on 07-Mar-2023 2K+ Views

The hamburger menu icon has three vertical bars, which the navbar uses to expand and collapse the menu on mobile and tablet devices. This tutorial will teach us to create a hamburger menu from scratch. Here, we will use HTML, CSS, JavaScript, and Bootstrap to create a stylish hamburger menu with a navbar. Steps Users can follow the steps below to create a navbar with a hamburger menu icon. Step 1 − Create a div with a container class containing a navbar and an expandable menu. Step 2 − After that, create a div with a header class inside ...

Read More

How to use Regex to get the string between curly braces using JavaScript?

Shubham Vora
Shubham Vora
Updated on 06-Mar-2023 6K+ Views

We can create a regular expression so it can find all the substrings between the curly braces. After that, we can use the exec() or match() method to extract the matching substring. In this tutorial, we will learn to use a regular expression to get the string between curly braces using JavaScript. For example, if we have given a string like ‘This is a {string} with {curly} braces, we need to extract all substrings that reside between the curly braces. Using the exec() method with a regular expression to get the string between curly braces The exec() ...

Read More

How to use Particle.js in JavaScript project?

Shubham Vora
Shubham Vora
Updated on 06-Mar-2023 2K+ Views

As the name suggests, the Particle.js library allows us to add particles to a particular HTML element. Also, we can change the shape of the particles number of particles in the div. We can add animation or motion to particles using the Particle.js library. Here, we will learn to change the shape, colour, and motion of particles via different examples. Syntax Users can follow the syntax below to use the Particle.js library in a JavaScript project. tsParticles.load("id", { particles: { // properties for the ...

Read More

Javascript Program to Count 1’s in a sorted binary array

Prerna Tiwari
Prerna Tiwari
Updated on 06-Mar-2023 493 Views

We have two approaches to count 1’s in a sorted binary array. The first one is to iterate through the array and count the 1's. The second approach is to use a binary search algorithm to find the first occurrence of 1 in the array. It is important to note that in order to use these approaches, the array must be sorted. In this blog post, we will discuss a JavaScript program to count the number of 1's in a sorted binary array. We will also look at some edge cases and optimization techniques to make the program ...

Read More

How to create a new object from the specified object, where all the keys are in lowercase in JavaScript?

Prerna Tiwari
Prerna Tiwari
Updated on 06-Mar-2023 3K+ Views

There are many methods for creating new objects from older ones in JavaScript. Creating a new object with the same keys as an existing object but with all the keys in lowercase is a common use case. When working with data from many sources that have irregular key casing, this can be helpful. We'll look at various JavaScript ways to create new objects with lowercase keys in this blog post. However, before doing so, it's important to remember that while creating a new object with lowercase keys might be helpful when working with data from various sources, it's also ...

Read More

How to create a JavaScript callback for knowing if an image is loaded?

Prerna Tiwari
Prerna Tiwari
Updated on 06-Mar-2023 3K+ Views

Strong programming languages like JavaScript are frequently used to build interactive, dynamic web pages. The loading of images on a website is one of JavaScript's most popular uses. However, loading images might be challenging, particularly when determining whether a load is complete. In this article, we'll go through how to make a JavaScript callback that detects if an image has loaded or not. What is a callback function? A callback function is a function that is invoked after the initial function has finished running and is supplied as an argument to another function. To put it another way, a ...

Read More
Showing 1761–1770 of 5,339 articles
« Prev 1 175 176 177 178 179 534 Next »
Advertisements