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 draw a rounded Rectangle on HTML Canvas?
To draw a rounded rectangle in HTML Canvas, we need to use the Canvas API methods. While the rect() method creates regular rectangles, it doesn't support rounded corners. Instead, we combine lineTo() for straight edges and quadraticCurveTo() for curved corners to create smooth rounded rectangles. The HTML5 element provides a drawing surface where we can create graphics using JavaScript. For rounded rectangles, we manually draw each side and corner using path methods. Syntax Following is the syntax for creating a rounded rectangle using canvas methods − ctx.beginPath(); ctx.moveTo(x + radius, y); ctx.lineTo(x + width ...
Read MoreHow to merge table cells in HTML?
We use the colspan and rowspan attributes to merge cells in HTML tables. The rowspan attribute specifies the number of rows a cell should span vertically, whereas the colspan attribute specifies the number of columns a cell should span horizontally. These attributes should be placed inside the tag or tag to merge table cells and create more complex table layouts. Syntax Following is the syntax for the rowspan attribute to merge rows − cell data Following is the syntax for the colspan attribute to merge columns − cell data ...
Read MoreHow to draw shapes using SVG in HTML5?
SVG (Scalable Vector Graphics) is a language for describing 2D graphics and graphical applications in XML format. The XML is rendered by an SVG viewer, and most modern web browsers can display SVG just like they display PNG, GIF, and JPG images. SVG graphics are vector-based, making them scalable without quality loss at any size. You can draw various shapes like circles, rectangles, lines, polygons, and more using SVG in HTML5. SVG elements are embedded directly in HTML and can be styled with CSS or manipulated with JavaScript. Syntax Following is the basic syntax for embedding SVG ...
Read MoreHTML DOM Input Date stepDown() Method
The HTML DOM Input Date stepDown() method decreases the value of a date input field by a specified number of days. This method is useful for programmatically adjusting dates without requiring manual user input. Syntax Following is the syntax for the stepDown() method − inputDateObject.stepDown(number) Parameters The stepDown() method accepts the following parameter − number − An optional integer specifying how many days to decrease. If omitted, defaults to 1. Return Value The method does not return any value. It directly modifies the value of the ...
Read MoreHow to draw a star by using canvas HTML5?
Drawing on the HTML canvas is done with JavaScript. The canvas element provides a drawable region controlled by scripting APIs. To draw a star in HTML5, we use the element combined with JavaScript's Canvas API methods like moveTo(), lineTo(), and fill(). The canvas drawing process requires getting the canvas element using getElementById() and obtaining the 2D rendering context with getContext('2d'). Once we have the context, we can draw shapes by defining paths and filling or stroking them. Syntax Following is the basic syntax for creating a canvas and drawing on it − ...
Read MoreHTML DOM Anchor hash Property
The HTML DOM Anchor hash property is used to set or return the anchor part of the href attribute value. The anchor part is the portion of the URL that comes after the # symbol, which is used for navigation to specific sections within a page. Syntax Following is the syntax to set the hash property − anchorObject.hash = anchor_part Above, anchor_part is the anchor part of the URL including the # symbol. Following is the syntax to return the hash property − anchorObject.hash Return Value The hash ...
Read MoreHTML DOM Input Date stepUp() Method
The HTML DOM Input Date stepUp() method increases the value of a date input field by a specified number of days. This method is useful for programmatically incrementing dates in forms without requiring user interaction with the date picker. Syntax Following is the syntax for the stepUp() method − inputDateObject.stepUp(number) Parameters The stepUp() method accepts the following parameter − number (optional) − A positive integer specifying how many days to increase the date value. If not provided, the default value is 1. Return Value The stepUp() method does ...
Read MoreHow to specify citation in HTML?
The tag in HTML is used to specify citations or references to creative works such as books, articles, movies, songs, or research papers. The content within the tag typically appears in italics by default in most browsers, indicating that it represents the title of a referenced work. Syntax Following is the syntax for the tag − Title of the work The tag is an inline element that should contain only the title of the work being referenced, not the author's name or additional descriptive text. Basic Citation Example ...
Read MoreHTML DOM Input Date type Property
The HTML DOM Input Date type Property returns or sets the type attribute of an input element with date type. This property allows you to dynamically change the input type from a date picker to other input types like text, radio, or checkbox using JavaScript. Syntax Following is the syntax for returning the type property − inputDateObject.type Following is the syntax for setting the type property − inputDateObject.type = stringValue Parameters The stringValue parameter can be any valid HTML input type. Common values include − ...
Read MoreHow to draw an SVG file on an HTML5 canvas?
To draw an SVG file on an HTML5 canvas, you need to convert the SVG into an image format that the canvas can render. The canvas element cannot directly draw SVG markup, but it can draw Image objects. This process involves creating an SVG string, converting it to a Blob, generating an object URL, and then drawing it using the drawImage() method. Syntax Following is the basic syntax for drawing SVG on canvas − var svgString = '...'; var blob = new Blob([svgString], {type: 'image/svg+xml'}); var url = URL.createObjectURL(blob); var img = new Image(); img.onload = ...
Read More