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 Mukul Latiyan
Page 20 of 37
Position Tooltips and Popovers using Popper.js
Popper.js is a JavaScript library used to build and manage poppers, tooltips, and popovers in web applications. It provides powerful positioning capabilities that automatically handle edge detection and placement calculations. In this tutorial, we'll create an interactive tooltip using Popper.js. Setting Up Popper.js First, include Popper.js in your project. We'll use the CDN version for simplicity: Basic HTML Structure Create a button element (reference) and a tooltip element (popper). The tooltip will be positioned relative to the button: Popper Tooltip Example ...
Read MoreValidating a Form with Parsley.js
In this tutorial, we will show how you can use Parsley.js, which is a JavaScript library that is mainly used to validate forms. Parsley helps in validating the forms in a very subtle and easy manner, and it is one of the widely used form validation libraries out there. Features of Parsley.js There are plenty of reasons why Parsley is a good choice for validating your JavaScript forms. Some of them are mentioned below. Intuitive DOM API − The DOM API allows you ...
Read MoreWorking with HTML5 Canvas Elements using Easel.js
The popularity of HTML5 Canvas elements is well-known, as they allow web developers to create animations, full-fledged applications, and interactive charts. However, working with canvas can be challenging, especially for developers coming from a Flash animation background. In this tutorial, we will explore the Easel.js library, which simplifies working with HTML5 Canvas elements. The syntax of Easel.js is similar to ActionScript and includes familiar features like Display List, Stage, and Graphics, making canvas development more accessible for Flash developers. Installing Easel.js The first step is to import Easel.js into your project. The easiest way is using the ...
Read MoreTaffyDB – A JavaScript Database for Your Browser
TaffyDB is a lightweight and powerful in-memory database that can be used in both browser and server-side applications. It is open-source and free to use. In this tutorial, we will take a couple of examples to show how you can use TaffyDB to store some data, execute some queries on the data, and also perform important operations on the data. Getting Started with TaffyDB The first step is to include TaffyDB in your project. You can use the CDN link or download the library directly from the official repository. Basic Example - Creating and Reading Data ...
Read MoreLogging HTTP Requests and Errors using Morgan.js
Morgan is a middleware for Node.js that simplifies HTTP request logging in Express applications. It automatically captures and formats request information, eliminating the need to write custom logging code manually. Morgan helps gather logs from your server and prepares them for analysis. It provides many predefined formats and customization options, making it suitable for both small and large projects. Installing Morgan Install Morgan using npm: npm install morgan Then import it into your application: const morgan = require('morgan') Basic Usage Example Here's a simple Express application using Morgan ...
Read MoreVoca: The Ultimate Javascript library for String Manipulation
Voca is a powerful JavaScript library designed specifically for string manipulation. In this tutorial, we will explore multiple examples demonstrating how to use the different functions available in Voca. Features of Voca Before we see all the examples, let's highlight some features that Voca brings to the table − It provides a multitude of functions that can be used to manipulate, query, escape, format strings. It also provides detailed and searchable documentation. It supports a wide range of environments like Node.js, Safari 7+, Chrome, ...
Read MoreAdding a Carousel to Your Site with Slick.js
In this tutorial, we will demonstrate how to use Slick.js to create responsive carousels for your websites. We'll start with a basic image carousel and then explore various customization options to enhance its functionality. If you try to create a carousel without using any libraries, it will be quite time-consuming. To reduce the effort and add multiple types of carousels with different properties, you can use Slick.js. Slick.js is a widely used jQuery plugin that allows us to create responsive carousels with multiple attributes and different properties. Features of Slick.js There are multiple reasons why Slick.js ...
Read MoreAdding Animations on Scroll with HTML, CSS and AOS.js
AOS.js (Animation on Scroll) is a lightweight JavaScript library that makes it easy to add scroll-triggered animations to web pages. By simply adding CSS classes and data attributes to HTML elements, you can create engaging visual effects without writing complex JavaScript code. In this tutorial, we will explore different types of animations available in AOS.js, including fade, flip, and zoom effects, along with practical examples. Setting Up AOS.js Before using AOS.js, you need to include the CSS and JavaScript files in your HTML document. Add the following CDN link in the section: ...
Read MoreAdding Animations to a Webpage using Velocity.js
Animations have become a very integral part of website interfaces in today's web development world. They help in enhancing the user experience of a website and in this article, we will learn how we can make use of Velocity.js to add beautiful animations to our web pages. VelocityJS is a JavaScript animation engine that provides us with very fast performing animations that we can use in our web pages. It has become one of the leading animation engines and there are different reasons for its success. I have mentioned some of the most important reasons that make it a ...
Read MoreBuilding a Text Editor using Quill.js
Quill is a free and open-source WYSIWYG (What You See Is What You Get) text editor built for modern web applications. It offers a highly customizable interface with an expressive API, making it easy to integrate rich text editing capabilities into your projects. In this tutorial, we'll explore how to build text editors using Quill.js through practical examples, from basic setup to advanced customization. Setting Up Quill.js To get started with Quill, include the CSS and JavaScript files in your HTML document's section: The first link provides the CSS styling, ...
Read More