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 on Trending Technologies
Technical articles with clear explanations and examples
How to deal with Internet Explorer and addEventListener problem "Object doesn't support this property or method" in JavaScript?
Internet Explorer versions 8 and below don't support the standard addEventListener() method, causing the "Object doesn't support this property or method" error. This article shows how to handle cross-browser event handling. The Problem Modern browsers use addEventListener() for event handling, but older Internet Explorer versions use attachEvent() instead. Using addEventListener() directly will fail in IE8 and below. Solution 1: Using IE=edge Meta Tag Force Internet Explorer to use its latest rendering engine by adding this meta tag to your HTML head: ...
Read MoreDrawing lines with continuously varying line width on HTML canvas
Drawing lines with continuously varying line width on HTML canvas creates smooth, dynamic visual effects. This technique uses quadratic curves and gradually increases the line width to create flowing, organic-looking lines. Understanding the Approach The technique involves generating a series of points along a curved path and drawing segments between them with incrementally increasing line widths. Each segment uses quadraticCurveTo() to create smooth curves rather than sharp angles. Complete Example Variable Line Width Canvas ...
Read MoreAdding HTML5 Validation to Visual Studio
Visual Studio 2012 and later versions include built-in IntelliSense and validation support for HTML5. Visual Studio 2010 had basic IntelliSense support for HTML5, but VS 2012 added corresponding code snippets, making it faster and easier to write HTML5 markup. Enabling HTML5 Validation in Visual Studio Follow these steps to enable HTML5 validation: Launch Visual Studio 2012 (or later). Go to Tools > Options from the menu bar. In the Options dialog, navigate to Text Editor > HTML > Validation. In ...
Read MoreAdding two Sets in Javascript
The operation of adding 2 sets is known as a union. You need to add every element from one set to another while checking for duplicates. JavaScript's built-in Set class doesn't include a union method, but we can implement it using several approaches. Method 1: Using Spread Operator (Recommended) The most concise way to combine two sets is using the spread operator: let setA = new Set([1, 2, 3, 4]); let setB = new Set([2, 3, 5, 6]); // Create union using spread operator let unionSet = new Set([...setA, ...setB]); console.log(unionSet); console.log("Size:", unionSet.size); ...
Read MoreHow to add a new element to HTML DOM in JavaScript?
In JavaScript, adding new elements to the HTML DOM involves creating elements and inserting them into the document structure. This process requires understanding three key methods: createElement(), createTextNode(), and appendChild(). Core Methods for DOM Manipulation The Document object provides essential methods for creating and adding elements to the DOM: document.createElement(tagName) - Creates a new HTML element document.createTextNode(text) - Creates a text node appendChild(element) - Adds an element as the last child insertBefore(newElement, referenceElement) - Inserts an element before a reference element Syntax // Create element const element = document.createElement(tagName); // Create ...
Read MoreJavaScript - Creating a Custom Image Slider
An image slider is a user interface component in JavaScript that allows users to view a series of images in a slideshow format. It is also known as a carousel or slideshow. An image slider consists of navigation buttons (such as next and previous buttons) that allow users to navigate from one image to the other. With the help of basic HTML for structuring and CSS for designing or making the image slider presentable, along with simple JavaScript logic, you can create an image slider efficiently. This article will guide you through creating a basic image slider with navigation ...
Read MoreHow to multiply two Arrays in JavaScript?
In JavaScript, multiplying two arrays means performing element-wise multiplication, where each element at the same index in both arrays is multiplied together. This creates a new array with the products. Element-wise Array Multiplication When multiplying arrays, we iterate through corresponding indices and multiply the values at those positions: Array Multiplication Multiply Two Arrays Multiply Arrays ...
Read MoreTaking part from array of numbers by percent JavaScript
We have an array of number literals like this: const numbers = [10, 6200, 20, 20, 350, 900, 26, 78, 888, 10000, 78, 15000, 200, 1280, 2000, 450]; We need to write a function that takes an array of numbers and a percentage (0-100). The function should return the first n elements from the array that sum up to equal or just less than the specified percentage of the total array sum. Understanding the Problem Let's take a simpler example: const numbers = [12, 10, 6, 8, 4, 2, 8]; ...
Read MoreCounting occurrences of vowel, consonants - JavaScript
We are required to write a JavaScript function that takes in a string which contains English alphabet, for example − const str = 'This is a sample string, will be used to collect some data'; The function should return an object containing the count of vowels and consonants in the string i.e. the output should be − { vowels: 17, consonants: 29 } Understanding the Problem To count vowels and consonants, we need to: Iterate through each character in the string Check if the character ...
Read MoreWhat is the usage of onfocus event in JavaScript?
The onfocus event is triggered when an HTML element receives focus, typically when a user clicks on an input field or navigates to it using the Tab key. This event is commonly used to provide visual feedback or perform actions when users interact with form elements. Syntax // HTML attribute // JavaScript event listener element.onfocus = function() { /* code */ }; element.addEventListener('focus', function() { /* code */ }); Example: Basic onfocus Implementation Click on the input field to see the onfocus effect: ...
Read More