Web Development Articles - Page 60 of 801

How to scroll the page up or down using anchor element in jQuery?

Tarun Singh
Updated on 10-May-2023 12:58:20

4K+ Views

jQuery is a popular JavaScript library that simplifies the process of manipulating HTML documents, handling events, and creating animations. In this article, we'll see how to scroll the page up or down using the anchor elements in jQuery. We sometimes encounter large content pages on websites and to go to a specific section, we want to perform the scrolling in the page up or down. To solve this problem, there are several ways to achieve this, but using anchor elements is one of the easiest and most straightforward methods. Apart from this, we’ll see the scrollTop and animate to perform ... Read More

How to rotate shape loader animation using CSS?

Tarun Singh
Updated on 10-May-2023 12:52:12

3K+ Views

In this article, we’ll see how to rotate shape loader animation using CSS. Loading animations of different shapes is an essential part of a web app as it helps the users stay engaged while they wait for a website to load. There are multiple animations that one can add to a web page or application, one popular type of loading animation is the rotating shape loader. This animation has good features in which a shape is spinning continuously until the web page is fully loaded. Moving ahead, we are going to use a different approach to rotate the shape loader ... Read More

How to select the last row of a table using jQuery?

Tarun Singh
Updated on 10-May-2023 12:48:30

3K+ Views

jQuery is a widely used tool in JavaScript that simplifies the process of manipulating HTML documents and doing other tasks related to website development. In this article, we will see how to select the last row of a table using jQuery. Along with this, we’ll know different approaches to performing this task. Why Selecting the Last Row of a Table is Important? Let's see why we need to select the last of a table and why it becomes an important task. So basically when developers need to change or modify their new data into the existing table dynamically, it ensures ... Read More

How to design initial letter of text paragraph using CSS?

Tapas Kumar Ghosh
Updated on 10-May-2023 15:19:38

3K+ Views

We have seen in various chapters of many books guiding on how to design the first letter of word using CSS. In CSS we can use the ::first-letter pseudo-element to design the first initial letter of a text paragraph. This allows us to apply particular styles to the initial letter of the first line of a block-level element. For example, we may make the initial letter larger, a different font, or a different color from the rest of the text. Syntax p::first-letter{ property_name : value_name; } first-letter − The first letter is defined as the pseudo-element ... Read More

How to display a link using only CSS?

Tapas Kumar Ghosh
Updated on 10-May-2023 15:14:32

444 Views

To disable the link of any website, we use the properties of CSS like pointer-event set to none, and then the cursor can be set to default which will disable the active link and the users cannot access the links. Sometimes the link has to be disabled to bring some updates or security to the website. The government or organization is the best suited for this example, whenever they need any updation required in the backend of the website they simply disable the link. In this article, we will display how to display a link using only CSS. Syntax ... Read More

How to create animations using relative value in jQuery

Aman Gupta
Updated on 09-May-2023 17:02:29

444 Views

Overview The relative values are the values which are incremented or decremented with respect to any units. In the relative while performing the animation the object is not reset to its initial position but it starts growing from its current state. So to create a relative value animation can be achieved by using the jQuery ‘animate()’ method with any selector element. So we will learn how to use the relative value with animate method in jQuery with an example which will help you to learn about the relative value and animation. Syntax The syntax of the animate() method with respect ... Read More

How to Create an Animated Typing Effect using typed.js

Aman Gupta
Updated on 09-May-2023 17:00:08

3K+ Views

Overview Typed.js is an animation library supported by java script and other scripting languages. It provides the typing animation effect to the text. We can use this library by adding the CDN link of the library or by installing it using node package manager (NPM) or yarn. It gives a webpage with the typing animations in any paragraph or headings. So to know more about the typed.js typing animation effect. To use the animation the types.js provides a constructor named as typed() which takes two arguments as input. Syntax The syntax used to create the object of the constructor types ... Read More

How to create animated banner links using HTML and CSS

Aman Gupta
Updated on 09-May-2023 16:58:35

5K+ Views

Overview We can create animated banners using the HTML and CSS, HTML provides the layout of the banner and CSS provides the styling of the banners with the animations. Sometimes in the banners which are made for advertisement purpose links are embedded to them, so to highlight the link to the user of the web page the developer makes the link animated so it can be visible throughout the web content and that should increase the interest of the users to click it. Syntax The syntax to create a link in the HTML is − Algorithm Step 1 − Create ... Read More

How to create and read the value from cookies

Aman Gupta
Updated on 14-Jul-2023 16:49:37

613 Views

Overview Cookies are the temporary storage, which stores the user data in the form of key value pairs. Cookies are stored on the clients systems. When a user visits a website then a request is sent to the server to which the website is hosted, then it loads the content and sends it back to the receiving end(receiver is the client or a user). The server sends the cookie to store the user data for its future use. But it all depends upon the user whether he wants to store the login credentials to the cookie or not. In the ... Read More

How to create outline button in Bootstrap 4

Aman Gupta
Updated on 09-May-2023 16:49:14

615 Views

Overview Bootstrap is a Cascading Styles Sheet (CSS) framework which provides us with a different style and layout of buttons. So to use the bootstrap buttons we need to import the Content Delivery Network (CDN) link of bootstrap to our HTML document, the link can be imported from the official page of bootstrap. The official page provides the link in various bootstrap versions. To create the outline button using the bootstrap we need to import the certain classes to our HTML element. These classes are btn, btn-outline-colorName. We can change the color of the button by replacing the colorName with ... Read More

Advertisements