Found 10483 Articles for Web Development

How to Create Fullscreen API using JavaScript?

Imran Alam
Updated on 04-Aug-2022 07:58:29

965 Views

The Fullscreen API is a browser API that allows developers to request fullscreen display from the user, and to exit fullscreen when desired. Using the Fullscreen API is relatively simple. First, you must check if the browser you are using supports the Fullscreen API. You can do this by checking for the presence of the Fullscreen API's enabled property on the document object. If the browser does not support the Fullscreen API, you can still provide a fullscreen experience to your users by using another method, such as opening a new browser window. Assuming the browser does support the Fullscreen ... Read More

How to create a chessboard pattern with JavaScript and DOM?

Imran Alam
Updated on 03-Aug-2022 12:02:51

6K+ Views

With a little bit of JavaScript and DOM manipulation, you can create all sorts of interesting patterns on a webpage. In this tutorial, we'll show you how to create a chessboard pattern using JavaScript and the DOM.ApproachSTEP 1 − We start by creating a element with an id of "chessboard". This will be the element that contains our chessboard pattern.STEP 2 − We create a element that sets the width and height of the #chessboard div to 400px. We also create a class called .chess-square that sets the width and height of elements to 50px and floated to ... Read More

How to change string to be displayed as a superscript using JavaScript?

Shubham Vora
Updated on 02-Aug-2022 11:40:17

3K+ Views

In this tutorial, we are going to learn to change strings to be displayed as a superscript using JavaScript. As the name suggests, the superscript string is displayed at the half-height of the normal string. Also, characters of the superscript string are smaller than the normal string characters.There are a lot of uses of the superscript string while writing the mathematical formulas. For example, A2, B2, 105, etc. Also, we can use the superscript to show the chemical formulas such as O22-, H-, etc.Here, using HTML or JavaScript, users can learn to display string as a superscript.Display string as subscript ... Read More

Difference between Local Storage, Session Storage, and Cookies in JavaScript

Imran Alam
Updated on 01-Nov-2023 02:01:44

43K+ Views

JavaScript provides three mechanisms for storing data on the client − cookies, session storage, and local storage. Each one has advantages and disadvantages.Local storage is the most recent mechanism. It allows for larger amounts of data to be stored, but the data is not deleted when the browser is closed. Local storage is useful for storing data that the user will need to access later, such as offline data.Session storage is similar to cookies, but the data is only stored for the current session. This means that the data will be deleted when the user closes the browser. Session storage ... Read More

Difference between Function.prototype.apply and Function.prototype.call in JavaScript

Imran Alam
Updated on 29-Jul-2022 08:17:33

506 Views

Function.prototype.apply and Function.prototype.call are methods that allow you to call a function with a specific this value and arguments. The main difference between the two is that apply lets you pass in an array of arguments, while call requires you to list the arguments one by one.Function.prototype.applyFunction.prototype.apply is a method that allows you to call a function with a specific this value and an array of arguments.SyntaxThe syntax for using apply is −func.apply(thisArg, argsArray)Here thisArg is the value that will be used as this inside the function. argsArray is an array of arguments that will be passed to the function.ExampleHere’s ... Read More

How to convert 3-digit color code to 6-digit color code using JavaScript?

Kalyan Mishra
Updated on 29-Jul-2022 10:38:47

1K+ Views

In this tutorial, we will see how to convert 3-digit color code to 6-digit color code in JavaScript.So, basically three-digit color code represents the three-digit value of the colour of the form in #RGB format. To convert 3-digit color hex color to 6-digit we just have to do is convert every element of the three digit and make it duplicate.If we say in easy manner, then duplicating the three-digit color will give the hexadecimal whose value is same as three-digit color value.3-digit value: #RGB will be written as #RRGGBB in 6-digit color code.For example, 3-digit value: #08c 6-digit color Code: ... Read More

How to Create an Analog Clock using HTML, CSS, and JavaScript?

Kalyan Mishra
Updated on 26-Jul-2022 14:41:17

4K+ Views

In this tutorial, we will design an Analog Clock by the help of HTML, and CSS and make it work using JavaScript which will show the current time in hour, minute, and second format.ApproachWe will use the Date object and by using some calculations we will show hour, minute, and second.We will get the system time from JavaScript object Date() and this object has functions like getHours(), getSecond() and getMinutes().After getting hour, minute, and second format we will apply to transform rotation for all three needles hour, minute, and second.An analog clock shows time with its three hands moving continuously, ... Read More

How to swap two array elements in JavaScript?

Kalyan Mishra
Updated on 26-Jul-2022 14:33:55

4K+ Views

In this tutorial, we use different approach to swap two array elements in JavaScript. For example, we swap first and second element of the array asInput −["first", "second", "third", "fourth", "fifth"]Output −["second", "first", "third", "fourth", "fifth"]Here we swapped “first” and “second” value of the array.Now we will look at different methods to swap two elements −Using an extra variableUsing Array Splice() MethodUsing DestructuringMethod 1: Using an Extra VariableIn this method, we will take the help of an extra variable name “temp” and then we do the followingWe will copy the first element to temp.Copy the second element value to the ... Read More

How to build a random quote generator using HTML, CSS, and JavaScript?

Kalyan Mishra
Updated on 26-Jul-2022 14:25:30

2K+ Views

In this tutorial, we are going to build a project using HTML, CSS, and JavaScript which will be generating a random quote from an API (type.fit).StepsWe will be following some basic steps −Creating HTML Elements and TemplatesAdding Styles using CSSJavaScript LogicCreating HTML Elements and TemplatesThe first step is to create HTML elements and templates. We first add a box in which items will be shown, then we will add a button when the button will be clicked that it will display a new random quote in the box, then span tag is used to show quote sign type font awesome ... Read More

How to create HTML list from JavaScript array?

Kalyan Mishra
Updated on 26-Jul-2022 14:04:34

10K+ Views

In this tutorial, we are going to see multiple ways to create an HTML list from a JavaScript array. If we talk about simple HTML list, then we create manually one by one all the lists using ul (unordered list) and inside that li (list) tag.Consider a case when you will have n number of items and you have to print that in a list then it will be a really hectic task to write all the items and print manually right? Then using the JavaScript iteration method this can be easily done.Let’s see various ways in JavaScript to create ... Read More

Advertisements