Resize Navigation Bar on Scroll with CSS and JavaScript

Aman Kumar
Updated on 19-Dec-2022 14:35:58

3K+ Views

In this article going to discuss how to resize a navigation bar on scroll with the help of CSS and JavaScript. A navigation bar contains the list of elements present in your website; including the links to navigate through the website. It usually the first pit-stop for the users visiting the website who seek guidance to walk through the website. Resizing is the same as hiding and showing the navigation. Here, we just need to increase the padding, and size of the navigation bar with the help of JavaScript. In this example we are creating a webpage displaying “navigation bar”. ... Read More

Create a Responsive Bottom Navigation Menu with CSS and JavaScript

Aman Kumar
Updated on 19-Dec-2022 14:14:42

1K+ Views

In this article we are going to discuss how to create a responsive bottom navigation menu with CSS and JavaScript. Usually once you create a web page, when you alter the size of the page, some of the contents of the page will be hidden. A responsive page is the one which adjusts the contents of the page as we change the dimensions of the page. To create a responsive navigation menu, we have to use CSS and JavaScript. The responsive menu resizes the browser menu to see how the navigation menu works on small and mobile−size displays. In short ... Read More

Create Off-Canvas Menu with CSS and JavaScript

Aman Kumar
Updated on 19-Dec-2022 14:12:31

1K+ Views

In this, article we are going to create off canvas menu using CSS and JavaScript. Off−canvas menu lets you display your content as a sidebar when a button is activated. This helps you to display a certain aspect of your site in the side navigation panel thus giving a user−friendly familiarity to your guests. An off−canvas menu can also be accessed by sliding left−to−right or right−to−left (if you are using a touchscreen device) depending on the design of your website. This is usually used in cases where a website has a lot of links that don’t fit in the top ... Read More

Create Full Screen Overlay Navigation Menu with CSS and JavaScript

Aman Kumar
Updated on 19-Dec-2022 14:09:42

2K+ Views

In this article, we are going to discuss how to create a full−screen overlay navigation menu with CSS and JavaScript. Overlay in Web applications is nothing but transposing one HTML element over other. We can overlay images, pages, text, etc. There are three ways to create a full−screen overlay navigation bar which are listed below. From the left side, From the top side, and No animation. There is no Direct way to create an overlay; you can overlay two HTML elements using the technologies specified above. Steps to create a full-screen overlay navigation menu Following are the steps ... Read More

Voltage Regulator 7805: Internal Block Diagram and Applications

Manish Kumar Saini
Updated on 19-Dec-2022 13:58:27

11K+ Views

In this article, we will discuss the definition, internal block diagram, circuit configuration, and applications of voltage regulator 7805 IC. Let’s begin with the basic introduction of voltage regulator. A voltage regulator is an essential element of power supplies used in several electrical and electronic devices such as computers, amplifier, automobile alternator, mobile chargers, etc. A voltage regulator is basically an electronic circuit that generates a regulated voltage of fixed value from an unregulated fluctuating voltage. A voltage regulator is required in a circuit because all voltage sources cannot provide a steady voltage due to change in the load current ... Read More

Nature of Electricity

Manish Kumar Saini
Updated on 19-Dec-2022 13:56:33

4K+ Views

Electricity is form of energy that is obtained from other form of energy such as chemical energy, nuclear energy, heat energy, solar energy, etc. available in the nature. Electricity is the phenomenon associated with the existence and motion of the electric charge in the matter. This article is meant for explaining the nature of electricity. But before that we will understand the concept of electricity and is existence. The Concept of Electricity Electricity, also referred to as electrical energy, is a form of energy which is usually obtained from other forms of energy present in the nature. Electricity is a ... Read More

What is Space Charge: Definition, Causes and Consequences

Manish Kumar Saini
Updated on 19-Dec-2022 13:55:29

2K+ Views

The collection of electrons (electric charge) at a short distance away from a metal surface forming a cloud of electric charge around the metal surface is known as space charge. These electrons are emitted from the metal surface on the application of electric field. In other words, the space charge is defined as the spatial distribution of electric charge within an insulating medium. In this article, we will discuss the definition and consequences of the space charge. What is Space Charge? As discuss above, the space charge is the accumulation or collection of electric charge in a particular region within ... Read More

Regulated Power Supply: Circuit Diagram, Operation and Applications

Manish Kumar Saini
Updated on 19-Dec-2022 13:54:13

26K+ Views

We have several electrical and electronic circuits that require a DC power supply to operate. But, due to some technical and economical limitations, we cannot use conventional sources of DC power such as batteries and DC generators. In this situation, we use an electronic circuit that can convert AC power into DC power, such a circuit is known as rectifier. However, the DC power output of a rectifier is a fluctuating DC voltage and current which may damage the electronic circuit. Thus, to overcome the problem of variation in voltage, some voltage regulating devices are used so that we can ... Read More

Change Tabs on Hover with CSS and JavaScript

Aman Kumar
Updated on 19-Dec-2022 13:52:33

2K+ Views

In this article, we will discuss how to change tabs on hover with CSS and JavaScript. Hover Tabs are the easiest way to access the content of other tabs without leaving the current tab. When you hover over a tab that is not currently open, the content inside it will be displayed in a small window. Let us suppose you are accessing the Google Chrome browser with two tabs: one tab with a blog and the other tab containing a social media network. When you hover over the tab with social media network tab while accessing the blog tab, the ... Read More

Open Circuit Voltage: Definition, Calculation, and Example

Manish Kumar Saini
Updated on 19-Dec-2022 13:52:32

7K+ Views

In electrical and electronic circuits, the difference between potentials of two points is referred to as voltage or potential difference. Sometime we come across a term "open circuit voltage" while analyzing electric circuits. The term open circuit voltage is very common when we use Thevenin’s Theorem to analyze the circuit. Therefore, in this article, we will discuss what the open circuit voltage is, and how to calculate and test it. So let’s begin with a basic introduction of the open circuit voltage. What is Open Circuit Voltage? In an electric circuit, when a gap or open is created, and the ... Read More

Advertisements