Front End Technology Articles

Page 135 of 652

How to create an Animated bars using HTML and CSS?

Aman Gupta
Aman Gupta
Updated on 09-May-2023 1K+ Views

Overview Animated bars are the graphically animated bars which are created using HTML and CSS. The layout of the animated bars are created using HTML and the styling of the bars are made using CSS. The normal bars can be created normally but we have to create the bars with animation so we will be using the CSS transition animation properties to make it animated. We will be building an animated bar same as the music animated bars synchronizer. Algorithm Step 1 − Create a HTML file in your text editor and add the HTML boilerplate in it. Step 2 − Now ...

Read More

How to create a working slider using HTML and CSS?

Aman Gupta
Aman Gupta
Updated on 09-May-2023 4K+ Views

Overview A slider is a component which makes a slideshow like animation when the forward and backward navigation buttons are clicked. A slider consists of different images in an order one after another. We can create this working slider using HTML and CSS. So in the CSS we will be using the nth child selector to make the slider working. The nth child selector will select the particular child from the parent div and will make the image display on the front page. Algorithm Step 1 − Create an index.html file in a folder and open it in a text ...

Read More

CSS units – %, em, rem, px, vh, vw

Abhishek
Abhishek
Updated on 08-May-2023 1K+ Views

In CSS or the Cascading Style Sheet, there are many units available to represent the values of different properties in different ways according to the need. The CSS properties like: font-size, height, width and line-height etc are used to define the different properties to a container. The values of these properties can be assigned in the form of different units. In this article, we are going to learn about the different CSS units in details and implement them practically to understand use of each one of them. There are many CSS units available in CSS, but in this article ...

Read More

How to add a custom right-click menu to a webpage?

Abhishek
Abhishek
Updated on 08-May-2023 3K+ Views

In today’s time, when you right click on any web page there will be a list of some with some options and functionality pops up. This popup menu is also known as the context menu which is a default popup menu given by browser. The items in the list of this menu varies in different browsers. Some browsers provide more functionality while some provides limited. But here’s a way to add your own custom context menu or the right click menu on your web page with as much as options as you want. But before adding the custom context menu, ...

Read More

How to make the cursor to hand when a user hovers over a list item using CSS?

Abhishek
Abhishek
Updated on 08-May-2023 299 Views

In general, if we hover or take the cursor over an element in HTML document the cursor by default appears as an arrow or a selector if we hover it over a text. But, we can change the behaviour of the cursor on hover to selected elements to any type of available cursor types using the CSS property. Let us now discuss and understand how you can change the behaviour of the cursor on hover to any particular element using the :hover state and the cursor property of CSS. Cursor Property The cursor property in CSS comes with a lot ...

Read More

How to retrieve stored value from div element using jQuery?

Abhishek
Abhishek
Updated on 08-May-2023 1K+ Views

In some situations, we need to retrieve or get the text value stored inside a particular div element to use some condition, if the text is dynamic or for some other tasks in jQuery. By getting the value stored in the div element, we can perform any task based on the value of the element in jQuery. In jQuery, we can retrieve or get the stored value of a div element using three different methods. The methods are listed below − By using the text() method By using the html() method Let us now understand working of each ...

Read More

How to reverse array of DOM elements using jQuery?

Abhishek
Abhishek
Updated on 08-May-2023 756 Views

The array of DOM elements is an array of same multiple elements or of those elements which contains same class or the selecting attribute. Our task is to reverse an array of DOM elements using jQuery. There will be a lot of ways to reverse an array of DOM elements. But, in this article, we are going to discuss about the two methods to reversing and array of DOM elements. By using a for loop By using the reverse() method Let us now discuss both of these methods in details by practically implementing them with the help of ...

Read More

How to Deploy a Basic Static HTML Website to Heroku?

Aayush Mohan Sinha
Aayush Mohan Sinha
Updated on 05-May-2023 2K+ Views

Conveying a stationary HTML website to a hosting platform can be an intimidating feat, especially for fledgling web developers. However, the emergence of cloud hosting amenities like Heroku has streamlined and made the process more approachable. Heroku, a cloud-oriented platform-as-a-service (PaaS), provides a straightforward and productive technique for deployment and management of web-based applications. This composition entails a comprehensive walkthrough of the step-by-step method of deploying a fundamental stationary HTML website to Heroku, utilizing the Heroku Command Line Interface (CLI) and Git, while concurrently discussing the various configuration options accessible to developers. By abiding by the instructions outlined in this ...

Read More

How to demonstrate the use of Ajax loading data in DataTables?

Aayush Mohan Sinha
Aayush Mohan Sinha
Updated on 05-May-2023 2K+ Views

In the realm of web development, the ability to efficiently load data using Ajax can be a game-changer for user experience. DataTables, a powerful jQuery plugin for creating dynamic and responsive data tables, offers a straightforward approach to incorporating Ajax loading into data tables. However, some developers may find the process of integrating Ajax loading into their DataTables challenging. In this article, we will explore the step-by-step approach to demonstrating the use of Ajax loading data in DataTables, delving into the underlying concepts and syntax necessary for success. By following this guide and utilizing the various parameters available within DataTables, ...

Read More

How to delete text from document using HTML?

Aayush Mohan Sinha
Aayush Mohan Sinha
Updated on 05-May-2023 913 Views

In the domain of web development, the capacity to handle text within a file is an indispensable expertise for designing interactive and captivating user interfaces. HTML, the widely recognized coding language utilized for making web pages, furnishes developers with a variety of mechanisms for removing text from a file. Although this may appear to be a simple task, apprehending the fundamental syntax and aspects implicated is fundamental for producing top-quality web applications. In this composition, we shall scrutinize the incremental process of eliminating text from a document utilizing HTML, contemplating on the diverse approaches and deliberations that developers ought to ...

Read More
Showing 1341–1350 of 6,517 articles
« Prev 1 133 134 135 136 137 652 Next »
Advertisements