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 George John
Page 17 of 79
Usage of border-left-color property in CSS
The border-left-color property in CSS is used to set the color of an element's left border. This property only works when a left border is already defined using the border-left-style or border property. Syntax border-left-color: color | transparent | initial | inherit; Parameters Value Description color Sets the left border color (hex, rgb, color name) transparent Makes the left border transparent initial Sets to default value inherit Inherits from parent element Example ...
Read MoreGetting Tooltips for mobile browsers in HTML
Mobile browsers don't display tooltips on hover since there's no mouse cursor. This tutorial shows how to create touch-friendly tooltips using jQuery that appear on tap. The Problem with Mobile Tooltips The HTML title attribute creates tooltips on desktop browsers when you hover over an element. However, mobile devices don't have hover states, so these tooltips are inaccessible to mobile users. HTML Structure Start with a basic HTML element that has a title attribute: The underlined character. jQuery Implementation This jQuery code creates a tap-to-toggle tooltip ...
Read MoreAutocomplete text input for HTML5?
Use the autocomplete attribute for autocomplete text input. The autocomplete attribute is used with form elements to set the autocomplete feature on or off. If the autocomplete feature is on, the browser will automatically show values based on what users entered before in the field. If the autocomplete feature is off, the browser won't automatically show values based on what users entered before in the field. Attribute Values The following are the attribute values: S. ...
Read MoreWhat is the fastest, pure JavaScript, Graph visualization toolkit?
When building interactive graph visualizations in JavaScript, choosing the right toolkit is crucial for performance. The JavaScript InfoVis Toolkit (JIT) stands out as one of the fastest, pure JavaScript solutions for creating dynamic graph visualizations. What is JavaScript InfoVis Toolkit? The JavaScript InfoVis Toolkit is a lightweight, high-performance library that provides advanced graph visualization capabilities without requiring additional plugins or dependencies. It's designed specifically for creating interactive data visualizations with smooth animations and responsive interactions. Key Features With the JavaScript InfoVis Toolkit, you can implement various visualization features: Graph manipulation - Add, remove, and ...
Read MoreSet the right margin of an element with CSS
The margin-right property in CSS is used to set the right margin of an element. It creates space on the right side of an element, pushing it away from adjacent elements or the container's edge. Syntax margin-right: value; Values The margin-right property accepts several types of values: Length units: px, em, rem, pt, cm, etc. Percentage: Relative to the width of the containing element auto: Browser calculates the margin automatically inherit: Inherits from parent element Example with Different Values ...
Read MoreCSS content: attr() on HTML5 progress doesn't work
The CSS content: attr() function doesn't work directly with HTML5 elements due to browser rendering limitations. Here's how to work around this issue. The Problem When you try to use content: attr() with progress elements, it fails because progress bars use special internal pseudo-elements that don't support generated content in the same way as regular elements. HTML Structure .progress-container { position: relative; ...
Read MoreHow to set the CSS margin properties in one declaration?
The margin property defines the space around an HTML element. It is possible to use negative values to overlap content. It specifies a shorthand property for setting the margin properties in one declaration. Syntax margin: value; margin: top right bottom left; margin: top horizontal bottom; margin: vertical horizontal; Margin Value Patterns The margin property accepts 1 to 4 values with different behaviors: Values Result Example 1 value All sides same margin: 20px 2 values vertical | horizontal margin: 10px 5px 3 values top | horizontal ...
Read MoreUsage of CSS list-style-type property
The list-style-type CSS property allows you to control the shape or appearance of list item markers. This property works with both ordered () and unordered () lists. Syntax list-style-type: value; Common Values for Unordered Lists Here are the most commonly used values for unordered list markers: .circle-list { list-style-type: circle; } .square-list { list-style-type: square; } .disc-list { list-style-type: disc; ...
Read MoreMeasure text height on an HTML5 canvas element
To measure text height on an HTML5 canvas element, you can extract the font size from the canvas context's font property or use the TextMetrics object for more precise measurements. Method 1: Extracting Font Size from Font Property Set the font size in points and extract the numeric value: const canvas = document.getElementById('myCanvas'); const context = canvas.getContext('2d'); // Set font in points context.font = "15pt Calibri"; // Extract height using regex to match digits var height = parseInt(context.font.match(/\d+/), 10); console.log("Text height:", height, "points"); Text height: 15 ...
Read MoreHow to set the minimum number of lines for an element that must be visible at the top of a page in JavaScript?
The orphans CSS property sets the minimum number of lines in a block container that must be shown at the top of a page when a page break occurs. In JavaScript, you can control this property through the DOM to manage print layout behavior. Syntax // Get the orphans value var orphansValue = element.style.orphans; // Set the orphans value element.style.orphans = "number|initial|inherit"; Parameters Value Description number Minimum number of lines (default is 2) initial Sets to default value inherit Inherits from parent element ...
Read More