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 Aman Kumar
38 articles
How do find out all elements that match a specific condition in JavaScript?
In JavaScript, there are multiple ways to find elements that match specific conditions. While the underscore.js library provides the _.where() function, modern JavaScript also offers native methods like filter(), every(), and find(). Using _.where() from Underscore.js The _.where() function belongs to underscore.js, a JavaScript library that provides utility functions. It finds elements that match specified properties in an array of objects. Syntax _.where(list, properties) Parameters: list − The array to search through properties − Object containing the matching criteria Return value: An array containing ...
Read MoreHow to create a top navigation menu for smartphones / tablets with CSS and JavaScript?
In this article, we are going to discuss how to create a responsive top navigation menu for smartphones and tablets using CSS and JavaScript. A navigation bar is usually the first pit-stop for users visiting a website who seek guidance to navigate through the site. It contains links to different sections of your website, providing easy access to important pages. Creating a mobile-friendly navigation menu involves using CSS media queries to hide navigation links on small screens and display a hamburger menu icon instead. When clicked, this icon toggles the visibility of the navigation links. How It ...
Read MoreHow to create a curtain navigation menu with CSS and JavaScript?
In this article, we will learn how to create a curtain navigation menu using HTML, CSS and JavaScript. The curtain navigation menu will overlay on the entire screen by pushing back the current page. These menus display the sub-links of a link to make the navigation more specific. To create curtain navigation, we have to do the same as we had done earlier. In curtain navigation, we have two buttons one is an open button (menu) and the other one is a close button (cross). When you click on the open button the navigation will be visible ...
Read MoreHow to create a collapsible sidebar menu with CSS and JavaScript?
A collapsible sidebar menu is a navigation component that can be toggled to show or hide menu items. When collapsed, it saves screen space while maintaining easy access to navigation links. This tutorial demonstrates how to create a responsive collapsible sidebar using HTML, CSS, and JavaScript. The sidebar starts hidden and slides in from the left when activated. When opened, it pushes the main content to the right, creating a smooth transition effect. This pattern is commonly used in responsive web design to optimize navigation on both desktop and mobile devices. HTML Structure First, create the basic ...
Read MoreHow to create a responsive slideshow with CSS and JavaScript?
In this article, we will create a responsive slideshow using JavaScript and CSS. A responsive slideshow is an interactive design element that displays a series of images with navigation controls, adapting to different screen sizes. A responsive slideshow allows users to browse through multiple images using arrow buttons or dot indicators. It's commonly used to showcase content while conserving space on web pages. HTML Structure First, create the HTML structure with a container for slides, navigation arrows, and dot indicators: 1 / 3 ...
Read MoreHow to deserialize a JSON into Javascript object?
Serialization is the process of converting an object such that it is transferable over the network. In JavaScript usually we serialize an Object into the JSON (JavaScript Object Notation) format. To deserialize a JSON string back into a JavaScript object, we use the JSON.parse() method. This method takes a JSON string and converts it into a JavaScript object or array that we can work with in our code. JavaScript object notation is commonly used to exchange data with web servers and REST APIs. The data we receive from a web server is always a string. To use this ...
Read MoreHow to create responsive Modal Images with CSS and JavaScript?
A modal is a dialog box/popup window that is displayed on top of the current page. Creating responsive modal images allows users to view enlarged versions of images that adapt to different screen sizes. Responsive modal images are images that enlarge to fit the viewport based on device resolution, orientation, and screen size. When clicked, they open in a modal overlay with smooth animations and can be easily closed by users. HTML Structure First, create the basic HTML structure with an image and modal container: ...
Read MoreHow can you detect the version of a browser using Javascript?
In this article, we are going to discuss how to detect the version of a browser using JavaScript. These days, most browsers are JavaScript-enabled. But still, there are some browsers that don't support JavaScript; or, some versions of some browsers don't support certain features of JavaScript. Therefore, in certain instances, there is a need to know the details of the client's web browser so that the applications can deliver appropriate content. Detecting the Version of a Browser You can detect the details of the current browser using navigator.appName and navigator.appVersion properties. To detect the version ...
Read MoreHow do I add a class to a given element using Javascript?
In JavaScript, there are various approaches to add a class to an element. We can use the .className property or the .classList.add() method to add a class name to a specific element. The class attribute can be used in CSS to style elements and perform various tasks for elements with the same class name. Using the className Property The className property allows you to add a class to an HTML element while preserving its existing classes. This property gets or sets the value of the class attribute of an element. When adding a new class to ...
Read MoreHow to get the size of a json object in JavaScript?
In this article, we will learn about various methods to get the size of a JSON object in JavaScript. Getting the size of a JSON object in JavaScript is the same as counting the total number of keys in an object. We can accomplish this using several different approaches. Using Object.keys() (Recommended) The Object.keys() method returns an array of the given object's enumerable property names. To get the size, we simply check the length of this array. Syntax Object.keys(objectName).length Example Size of JSON Object ...
Read More