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 set the color of the left border with JavaScript?
In this tutorial, we will learn how to set the color of the left border with JavaScript. To set the color of the left border in JavaScript, use the borderLeftColor property. Set the color on this property that you want for the border. We could also apply the borderColor property to set the color of the left border. A border is an HTML element's outline. Different sides can be set with different border colors. To set the color of the left border with JavaScript, we have different ways − Using the style.borderLeftColor property ...
Read MoreHow to either determine SVG text box width or force line breaks after 'x' characters?
When working with SVG text elements, you often need to control text wrapping since SVG doesn't automatically wrap text like HTML. This tutorial shows how to measure text width using getBBox() and implement word wrapping. The Problem SVG text elements don't wrap automatically. Long text will extend beyond boundaries, requiring manual line breaks based on width measurements. Using getBBox() for Text Measurement The getBBox() method returns the bounding box dimensions of SVG elements, including text width and height. ...
Read MoreDetect area of a PNG that is not transparent with HTML
To detect the non-transparent area of a PNG image in HTML, you need to use the Canvas API to access pixel data and scan for opaque pixels. This technique is useful for cropping images, collision detection, or optimizing sprite sheets. How It Works The process involves loading the image onto a canvas, getting the pixel data as a buffer, and scanning for non-transparent pixels to find the bounding box: Load the PNG image onto a canvas element Get the 32-bit RGBA pixel data using getImageData() Scan from ...
Read MoreChange the style of top border with CSS
The border-top-style property in CSS defines the line style of an element's top border. It accepts various values like solid, dashed, dotted, double, and more. Syntax border-top-style: value; Common Values Value Description solid Single solid line dashed Dashed line dotted Dotted line double Two solid lines groove 3D grooved effect ridge 3D ridged effect none No border Example Here's how to apply different top border styles: ...
Read MoreWhat is the importance of _isEqual() method in JavaScript?
The _.isEqual() method from Underscore.js and Lodash libraries provides deep equality comparison for JavaScript objects. Unlike native JavaScript comparison operators, it performs value-based comparison rather than reference-based comparison. Why _.isEqual() is Important JavaScript's native equality operators (== and ===) only check if two objects are the same reference in memory, not if they have the same content. The _.isEqual() method solves this by performing deep comparison of object properties, regardless of property order. Syntax _.isEqual(object1, object2); It accepts two values as parameters and returns true if they are equivalent, false otherwise. Example: ...
Read MoreHow to add form validation for empty input fields with JavaScript?
Form validation ensures users provide required information before submitting. JavaScript allows client-side validation to check for empty input fields and provide immediate feedback. Basic Empty Field Validation Here's a complete example that validates empty input fields: Form Validation Example JavaScript Empty Input Field Validation Name: ...
Read MoreCheck if three consecutive elements in an array is identical in JavaScript
We are required to write a JavaScript function, say checkThree() that takes in an array and returns true if anywhere in the array there exists three consecutive elements that are identical (i.e., have the same value) otherwise it returns false. Therefore, let's write the code for this function − Example const arr = ["g", "z", "z", "v" ,"b", "b", "b"]; const checkThree = arr => { const prev = { element: null, count: 0 ...
Read MoreSeparate odd and even in JavaScript
In JavaScript, separating odd and even numbers means rearranging an array so that all even numbers appear before all odd numbers. This is commonly achieved using custom sorting functions or array methods like filter(). Using Custom Sort Function The most efficient approach uses Array.sort() with a custom comparator that prioritizes even numbers: const arr = [2, 6, 3, 7, 8, 3, 5, 4, 3, 6, 87, 23, 2, 23, 67, 4]; const isEven = num => num % 2 === 0; const sorter = (a, b) => { if(isEven(a) && !isEven(b)){ ...
Read MoreCreate increment decrement plus minus buttons programmatically for HTML input type number in JavaScript
In JavaScript, you can create increment and decrement buttons for HTML input type number using the stepUp() and stepDown() methods. This approach provides better user experience by allowing precise control over numeric inputs. On clicking Increment (+), the number in the input field increases by the step value On clicking Decrement (-), the number in the input field decreases by the step value The buttons respect the min/max constraints of the input field Basic Implementation Here's how to create increment/decrement buttons programmatically: ...
Read MorePartially reversing an array - JavaScript
Suppose, we have an array of literals like this: const arr = [3, 5, 5, 2, 23, 4, 7, 8, 8, 9]; console.log("Original array:", arr); Original array: [3, 5, 5, 2, 23, 4, 7, 8, 8, 9] We are required to write a JavaScript function that takes in such an array and a number, say n (n must be less than or equal to the length of array). And the function should reverse the first n elements of the array within. For example, if for this array, the number is 4, then ...
Read More