Front End Technology Articles

Page 8 of 652

How to Auto-Resize an Image to Fit a div Container using CSS?

AmitDiwan
AmitDiwan
Updated on 17-Feb-2025 3K+ Views

To auto resize an image to fit a div container, it ensures that the image is scaled properly without affecting its original aspect ratio. It helps in preventing the distortion of image and ensures that image fills the container without stretching or cropping. In this article we are having a div container and an image. Our task is to auto-resize image to fit the div container using CSS. Approaches to Auto Resize an Image to Fit div Container Here is a list of approaches to auto-resize an image to fit the div container using CSS which we will be discussing ...

Read More

How to add a new row in a table using jQuery?

Alshifa Hasnain
Alshifa Hasnain
Updated on 12-Feb-2025 2K+ Views

In this article, we will learn to add a new row to a table using jQuery. jQuery, a fast and lightweight JavaScript library, in web development, dynamically adding or removing rows from a table is a common requirement, especially when dealing with forms or data entry interfaces. Use CasesThis functionality is particularly useful in scenarios such as − Creating dynamic forms where users can add multiple entries (e.g., adding multiple email addresses, phone numbers, or product details). Building data entry interfaces where the number of rows is not fixed. ...

Read More

How to Create a Fixed Footer with CSS?

AmitDiwan
AmitDiwan
Updated on 12-Feb-2025 846 Views

To create a fixed footer with CSS, we will use CSS position property. A fixed footer means that the footer will remain fixed at the bottom irrespective of the page scrolling. We will be discussing two different approaches to achieve this. In this article, we are having some written content in a box and a footer. Our task is to create a fixed footer with CSS. Approaches to Create a Fixed Footer Here is a list of approaches to create a fixed footer with CSS which we will be discussing in this article with stepwise explanation and complete example codes. ...

Read More

Create a media resources for media elements, defined inside video or audio elements in HTML5

Sindhura Repala
Sindhura Repala
Updated on 10-Feb-2025 703 Views

HTML5 supports five media elements, that are useful for creating media resources. The different media tags are , , , and . These tags are used to change the development, let us discuss each element in detail with an example − The tag To play videos on your web page, you can use the HTML element. This element provides a standard way to embed videos in a webpage. The simple code to embed a video is as follows − Your browser does not support the ...

Read More

How do I remove a particular element from an array in JavaScript

Revathi Satya Kondra
Revathi Satya Kondra
Updated on 10-Feb-2025 1K+ Views

In JavaScript, Removing a particular element from an array refers to the process of deleting or filtering out a particular element from the array. so that a element is no longer exists within that array. The Arrays are the most commonly used data structures in JavaScript, allowing developers to store and manipulate collections of items. Syntax Following is the syntax to remove a particular element from an array. array(index, deleteCount[, element1[, element2[, ...]]]) Parameters Here, we have three parameters to remove a particular element from an array in JavaScript − index − The index ...

Read More

Converting seconds in years days hours and minutes in JavaScript

Revathi Satya Kondra
Revathi Satya Kondra
Updated on 10-Feb-2025 2K+ Views

In this article, we create a function that takes in a number(num) which represents the number of seconds. So, it construct and return a string that contains information of years, days, hours and minutes contained in those seconds. Converting seconds into years, days, hours, and minutes in JavaScript involves breaking down a given total of seconds into more understandable time units. This process helps display elapsed time in a readable format. For the purpose of the article, we will consider that all the years have 365 days. Let us understand through some sample example of I/O Scenario − Sample Input ...

Read More

Converting array to phone number string in JavaScript

Revathi Satya Kondra
Revathi Satya Kondra
Updated on 30-Jan-2025 1K+ Views

To convert an array to a phone number string in JavaScript can be done by formatting the array elements into the desired phone number pattern. Following are the steps to learn how to convert array to phone number string in Javascript − Ensure that the array has the correct number of elements (usually 10 for a standard phone number). Join the elements of the array into a single string. Format the string into the desired phone number pattern, such as (XXX) XXX-XXXX. Let us understand through ...

Read More

Converting any case to camelCase in JavaScript

Revathi Satya Kondra
Revathi Satya Kondra
Updated on 30-Jan-2025 1K+ Views

In this article, we create a function that can take a string in any format. Such as normal case, snake case, pascal case or any other into camelCase in JavaScript. camelCase is a writing style where each word within a phrase is capitalized, except for the first word, and there are no spaces or punctuation. Let us understand through some sample example of I/O Scenario − Sample Input - const str = 'New STRING'; Sample Output - const output = 'newString'; Converting any case to camelCase in JavaScript Converting any case to camelCase in JavaScript is quite easy. Let's ...

Read More

Appending Suffix to Numbers in JavaScript

Revathi Satya Kondra
Revathi Satya Kondra
Updated on 30-Jan-2025 1K+ Views

Appending suffixes to numbers in JavaScript is used to add ordinal indicators (like "st", "nd", "rd", and "th") to the end of a number to denote its position in a sequence. This is useful for displaying dates, rankings, or other numeric data. A custom function can be created to append the correct suffix to a given number. The function handles special cases for numbers ending in 11, 12, and 13, and applies the appropriate suffix based on the last digit for other numbers. The task of our function is to ...

Read More

How to Find the action Attribute and method of a Form in JavaScript?

Lokesh Yadav
Lokesh Yadav
Updated on 27-Jan-2025 3K+ Views

In this article we are going to learn how to find the action attribute and method of a form with suitable examples in JavaScript. In HTML, there is  elements which has few attributes: input, label, text area, select, name, target. The action and method attributes of the form are used to return those values. The action attribute also specifies where to send the form data when form is submitted. To get a better idea of this concept, let’s look into JavaScript examples where we achieved the given task using action attribute and also with method attribute. Using action ...

Read More
Showing 71–80 of 6,517 articles
« Prev 1 6 7 8 9 10 652 Next »
Advertisements