Date First Published: 2nd October 2022
Topic: Web Design & Development
Subtopic: Web Design
Article Type: Computer Terms & Definitions
Difficulty: MediumDifficulty Level: 5/10
Learn more about what hover state in this article.
Hover state, also known as rollover state, is the appearance of a button or link whilst the pointer is hovered over it, but not clicking on it. The link or button may change colour, display an animation, or zoom in. Hover state is used to indicate that the button or link is clickable and is an interactive element of a website that can engage visitors. Although the cursor changing from an arrow to a hand indicates that an element is clickable, this is not enough as it will not help the visitor identify which link or button they are clicking.
The hover state is much harder to see on mobile devices as they have a touchscreen with no pointer, although it can be seen for a few seconds whilst a visitor is in the process of jumping from one page to another or clicking on the button, but only when touching it and activating the function.
Hover state can be implemented by specifying the colour and style of the element when hovered over in CSS. In the example below, the colour of the links and buttons change when hovered over. Before ':hover' the id of the element needs to be specified.
If so, it is important that you tell me as soon as possible on this page.
Network Services Network Setups Network Standards Network Hardware Network Identifiers Network Software Internet Protocols Internet Organisations Data Transmission Technologies Web Development Web Design Web Advertising Web Applications Web Organisations Web Technologies Web Services SEO Threats To Systems, Data & Information Threats To Individuals Security Mechanisms & Technologies Computer Hardware Computer Software Ethics & Sustainability Legislation & User Data Protection
