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 Jaisshree
Page 7 of 10
How to create a Hidden Header using Google AMP Amp-Accordion?
Google AMP (Accelerated Mobile Pages) is an open-source framework designed to create fast-loading and mobile-friendly web pages. The amp-accordion component allows you to create collapsible content sections where users can toggle visibility of content by clicking on headers, making it perfect for creating hidden header functionality. The amp-accordion component is particularly useful for creating FAQ sections, collapsible menus, or any content that needs to be initially hidden but easily accessible. Each accordion section consists of a header (typically an or element) and content that can be expanded or collapsed. Syntax Following is the basic syntax ...
Read MoreHow to Create a Basic Empty HTML Canvas?
HTML canvas is a sophisticated web-based tool for producing interactive and dynamic visuals. Developers can use JavaScript to manipulate the canvas element to create animations, games, data visualizations, and more. The element creates a drawable region that can be controlled with JavaScript for rendering graphics, charts, and interactive content. Syntax Following is the basic syntax for creating an HTML canvas element − Your browser does not support the canvas element. To access the canvas in JavaScript for drawing operations − const canvas = document.getElementById('canvasId'); const ctx ...
Read MoreHow to connect Skype, Mail and Phone using HTML?
To provide users with various options to reach out to you, consider integrating Skype, email, and phone features into your website. This article discusses the utilization of HTML to connect these communication channels, thereby enhancing the overall user experience on your site. Skype Integration Incorporating a Skype link into your website through HTML enables visitors to initiate voice or video calls directly from your webpage. By including your Skype username in the HTML code, users can effortlessly connect with you using the skype: URI scheme. Syntax Following is the syntax for creating a Skype call link ...
Read MoreHow to Convert Canvas Graphics to Image?
HTML canvas graphics provide lots of options to create versatile objects. While working with Canvas you might want to convert the graphics into real images which you can download or print. This article will help you create graphics and save them as image files on your device. The process involves creating graphics on an HTML5 element, then using the toDataURL() method to convert the canvas content into a downloadable image format (PNG by default). Syntax Following is the syntax for converting canvas to image using toDataURL() method − canvas.toDataURL(type, quality); Parameters: ...
Read MoreHow to Execute a Script Asynchronously in HTML5 ?
Script tag is used to make the webpage dynamic, however heavy scripts can result in slow rendering of the webpage which ultimately results in poor user experience. To solve this issue, we asynchronously execute the scripts in the webpage i.e. the JavaScript is downloaded in parallel with other website elements and starts to execute as soon as it is completed. To load scripts asynchronously two popular approaches are used − Async attribute − The scripts are downloaded in parallel and start to execute as soon as downloading is complete. Defer attribute − The scripts are downloaded in ...
Read MoreHow to Emphasize Text in a Document using HTML5?
Text may be emphasized in documents using a variety of HTML5 elements to highlight crucial information and make it easier for readers to identify important content. HTML5 provides both presentational and semantic elements for text emphasis, each serving different purposes in document structure and meaning. Different tags are used in HTML like , , , , , , , , and to emphasize text, add superscript and subscript formatting, and provide semantic meaning to content. Syntax Following are the syntax patterns for common text emphasis elements − bold text italic text underlined text strongly ...
Read MoreHow to Count all Child Elements of a Particular Element using JavaScript?
Child Node A node that is immediately nested inside another node in a document tree or DOM (Document Object Model) tree is referred to as a child node in JavaScript. Child nodes are specific HTML elements, text nodes, and comment nodes that are nested inside other HTML elements when working with HTML documents. Method 1: Using the childNodes Property The childNodes property returns a NodeList of all child nodes, including text nodes and comments. To count only element nodes, we need to check each node's nodeType property: Example Child 1 Child 2 ...
Read MoreHow to Convert Characters to ASCII Code using JavaScript?
ASCII stands for American Standard Code for Information Interchange, which is a method used for encoding characters by assigning them to a specific numerical value. The numerical values thus assigned are known as ASCII codes and are extensively utilized in computer systems to represent various characters including letters, numbers, punctuation marks, and special control characters. Using charCodeAt() Method The charCodeAt() method returns the ASCII code of the character at a specified index in a string. This is the most common method for ASCII conversion. Syntax string.charCodeAt(index) Example ...
Read MoreHow to create a CSS3 property for each corner?
CSS3 provides several methods to create custom corner styles for elements. This allows designers to move beyond simple rectangular shapes and create more visually appealing interfaces with unique corner treatments. Syntax /* Method 1: Border-radius */ border-radius: top-left top-right bottom-right bottom-left; /* Method 2: Individual corner properties */ border-top-left-radius: value; border-top-right-radius: value; border-bottom-right-radius: value; border-bottom-left-radius: value; /* Method 3: Clip-path */ clip-path: polygon(x1 y1, x2 y2, x3 y3, x4 y4); /* Method 4: Mask-image */ mask-image: gradient-function; Method 1: Using Border-radius Property The border-radius property allows you to specify different radius ...
Read MoreCreating an Animated Pill Shaped button using HTML and CSS
A pill−shaped button is a round corner attractive−looking button that resembles a pill or capsule. These buttons provide a modern, smooth appearance and can include transitions and hover effects for an enhanced user experience. This type of button design is commonly used for sign−up forms, call−to−action buttons, and navigation elements. Syntax .button { border-radius: value; transition: property duration; } .button:hover { background-color: color; } Key Properties PropertyPurpose border-radiusCreates the pill shape with rounded corners transitionAdds smooth animation effects :hoverDefines styles ...
Read More