Hover is an interaction state where a pointer (usually a mouse cursor) is held over an item to perform an action or display information.
5
votes
4answers
156 views
Hovering over an element to raise opacity
I'm working on a site where we display testimonials on the side of the page. We don't want these to be the main point of interest, so we dimmed the opacity, and on hover it goes to full opacity. We ...
4
votes
4answers
154 views
showing buttons on hover?
Lately I have noticed that a lot of websites are displaying a delete "X" when you hover over that specific panel. I have been thinking whether or not this was very usable for the user because there is ...
2
votes
6answers
237 views
Best practice for a desktop version dropdown hover menu to work on mobile?
I'll give my example as it explains exactly what I mean. We have a store that on the main menu has a "Shop" link that when hovered over, will display a dropdown menu of categories and subcategories. ...
1
vote
1answer
63 views
Is it ok to have both a placholder and a title on an input tag? [duplicate]
Is is a common practice to do that ? Or should I put informations linked to this input next to it ?
For example: <input type="text" title="You first, not your last name !" placeholder="Name"/>
...
3
votes
3answers
234 views
Why don't most forms have a hover state?
I've been looking at a bunch of forms and noticed that most form inputs do not have a hover state. Is there a good reason for this, that I'm missing?
A slight hover state, to me, is effective because ...
1
vote
2answers
92 views
Is it ok to show 'might interest you' on hover-cards?
I'm trying to decide regarding content of hover-cards. The conflict I'm trying to resolve is whether it's alright to direct to other pages on my site that can interest the viewer, or should I keep it ...
17
votes
7answers
806 views
Are hover states necessary?
We're having a discussion in the UX department here at work as to whether or not hover states are necessary to a UI. We're kind of divided. Here are the two arguments:
Against (started the ...
1
vote
3answers
213 views
Hover over web images for additional details best practices
I know that a discussion was already made on various places whether it is good to use hover on images on the web or in mobile apps. With the rise in mobile use where touch is prevalent do you think ...
8
votes
4answers
309 views
Should we be designing for touch first?
Touch interaction is becoming more ubiquitous and often the only option. Should we be designing for touch first or even touch only?
What are the ramifications of taking this approach?
As someone ...
2
votes
0answers
44 views
Mouse over gesture in touch interface [duplicate]
Possible Duplicate:
What are some alternatives to “hover” on touch-based devices?
I'm looking for a touch gesture/ other solution that would replace a mouse over indication ( like we see ...
2
votes
1answer
132 views
Standards or examples of graphically combining hover and sorting, in a column header?
I want to combine two things in the list header in our product:
Sort highlight like Spotify. We have a small sorting arrow indicator, but adding a highlight to the header of the sorted column makes ...
2
votes
2answers
135 views
Using hover-overs on the web when the goal is to allow rapid clicking
I'm working to design a webpage where users are presented with a large number of product options, most of which will be irrelevant. Each product will appear as a tile and the tile will disappear upon ...
16
votes
5answers
831 views
Why this timed-hover “like button”?
I recently caught "Where Good Ideas Come From" by Stephen Johnson on Alex Hillman's blog, and was intrigued by Alex's unique implementation of a 'like button'.
Behaviour
The element's initial state:
...
1
vote
1answer
112 views
How to render text that contains a tooltip / hover state?
I'm wondering about the best way to represent text that contains a flyout / tooltip (similar to Foursquare - see image below) but is not a link to another page.
In my case, there are a number of ...
3
votes
6answers
492 views
What do you call that interfacing zone?
What would you call the surface of contact which can activate an element when it passes over it. For example, the area that's covered is different whether you use a stylus, a finger or a mouse.
In ...
6
votes
2answers
504 views
Should the cursor change to pointer over radio buttons, checkboxes, their labels and selects?
I always do so because to me it feels nicer; it implies an action will happen on click. Especially for radio/checkbox labels, where the for attribute is correctly used.
This is not the default ...
8
votes
1answer
201 views
How often do users overlook controls that are revealed by hovering?
Techniques that reveal controls on hover (as used by apps like twitter) have been suggested as a way to simplify an interface and focus attention on content. However I wonder how many people fail to ...
1
vote
1answer
1k views
What should be the alternate of Hover on Mobile Devices? [duplicate]
Possible Duplicate:
iPad/iPhone alternative for hover states
Re-thinking “hover” functionality with touchscreens in mind
We have our intranet application using the Megflyouts ...
6
votes
4answers
396 views
Navigation & Link Hover State
Note: Please link me if this has been asked, I couldn't find what I was looking for
I just had a conversation with my mate who is an Art Director in regards to a website he designed, when it was ...
13
votes
4answers
649 views
Making space for the “drop cue” in a drag-n-drop design
I'm developing a drag-and-drop reordering interface for books on shelves.
(You can try it live if you're on the latest WebKit.)
When you drag a book over a shelf, it accommodates space for it by ...
4
votes
2answers
708 views
Mouseover to reveal more data in a table
I have a table containing users like so:
download bmml source – Wireframes created with Balsamiq Mockups
In the system, users can associate multiple emails with their account. When the ...
3
votes
5answers
359 views
How to ensure a user knows a box is clickable/hoverable
I have a calendar interface that indexes a bunch of gym classes for a user to pick among. These classes are represented as small boxes on the calendar, in a similar manner to how hipmunk.com does ...
6
votes
2answers
350 views
Shading buttons darker than the normal state vs. highlighting
While coding up pieces of a website, I was puzzled as to why the designer chose a hover state that is a shade darker than its normal state. It seems logical to me that a rollover state should be a ...
3
votes
1answer
289 views
Hover for More Info on a data grid
Should a data grid be able to use a hover for more information pattern? This type of pattern is commonly used in interfaces that have more of a thumbmail view of items, for instance on Netflix when ...
58
votes
7answers
9k views
Re-thinking “hover” functionality with touchscreens in mind
Take the following page as an example (possibly in Firefox only):
As you hover over each search result, an "+ Add to Firefox" button appears.
However, that idea of the button appearing upon ...
8
votes
8answers
465 views
How can I make it obvious that a page element is to be hovered over?
On my webpage I have five boxes containing the names of each step in a five step process. When the user hovers over one of the boxes, it expands and shows text explaining that process.
How can I ...
3
votes
3answers
2k views
Better to use hover vs. click to display dropdown menus on main navigation of web app?
I work on a web-based medical records system. In the previous version, main horizontal menu employed ExtJS. It used the standard click to display the sub-menu found in ExtJS. I'm considering whether ...
6
votes
2answers
249 views
Best way to give user two controls (expand and select) on a single object
We're working on an organizational tree visualization, for each node (circle) in the tree the user has two options - expand the node to see its children OR select the node
In general, the primary ...
2
votes
3answers
272 views
How to resolve a multilevel sidebar menu where parent sections must show children AND link somewhere
Note: When reading this keep in mind we may have more of an information architecture problem than a menu usability one.
Suppose we have this menu:
Item 1 ............ Should link to ...
40
votes
9answers
4k views
Should a button become lighter or darker on hover?
We're having a discussion in the office about whether a button should become lighter or darker when a user hovers over it.
Here are some examples from the field:
Apple "Buy Now" button (Second is ...
13
votes
7answers
774 views
Are hover menus in headers easy to use?
Do users find it easy to use headers/menus like the one displayed below?
4
votes
3answers
3k views
Should my menus drop down on hover + on click or just on click?
I have a web application that currently has menus that drop down 'on hover'. This is obviously an issue on tablets, etc. where there is no hover equivalent.
So, I need to add an 'on click' ...
5
votes
6answers
350 views
Rough and fine adjustments with horizontal slider
I'm used to scrolling being thrice as effective as arrowkeys in Firefox.
I want to give the ability to quickly and roughly adjust values by hovering over the slider and using the scrollwheel. Finest ...
6
votes
2answers
959 views
Examples of a zoom/pan on hover [closed]
I've got this user interface idea in mind for my dashboard app, and I swear I've seen it before but cannot find an instance of it on the web.
The essence is that you present a thumbnail image to the ...
5
votes
3answers
457 views
Why are different cursors used when hovering over buttons in Gmail?
In the Gmail interface they are not consistent in which cursor they use on button/link hover.
They use the "hand" pointer for:
Links in the sidebar(mail, contacts, inbox, starred etc..)
The mails ...
11
votes
6answers
6k views
iPad/iPhone alternative for hover states
I've recently updated my personal portfolio with some CSS3 and jQuery magic. I'm extremely pleased with the results and yes, it's fully responsive. But i have an issue. I've structured my portfolio ...
5
votes
2answers
428 views
Hover over icon
Along the lines of visual clues when hovering over a hyperlink, doesn't the same apply to icons?
I ask this question since I noticed none of the SE sites I know of have this behavior when hovering ...
15
votes
6answers
20k views
Default cursor on mouse over of a button is not a hand pointer
Why is the default cursor an arrow when you hover over an HTML <button>? I always thought that arrows let you select stuff, but hands let you execute an action. Since buttons execute actions, ...
7
votes
3answers
869 views
Change text color when hovering over hyperlink
Should the text color change when hovering over a hyperlink? I usually change my hyperlinks to a lighter shade of blue upon hover.
a:link {
color: #0088cc;
}
a:hover {
color: #0099dd;
}
I ...
30
votes
7answers
7k views
What are some alternatives to “hover” on touch-based devices?
Came up recently in a 37signals podcast:
http://37signals.com/podcast#episode18
The straightforward, "brute-force" solution is to just use the first touch on a UI object as the hover.
...
18
votes
6answers
1k views
Why is there a convention on the web for dropdown menus on hover instead of on click?
This is something I've always wondered. On all major operating systems, application menus (File/Edit/View etc) only appear on click. However, nearly every web site that uses a drop-down menu ...
6
votes
4answers
655 views
How long should the delay be before a tooltip pops up?
I'm working on web site in which a "ribbon" submenu pops up as soon as the mouse touches one of the main menu items. I'm trying to explain to the designer that it should wait until the cursor has ...
13
votes
5answers
703 views
box-shadow hover effect when box isn't necessarily clickable
It isn't a secret that giving the user feedback on a link hover (image swap/sprite, link color/decoration change, etc.) is a necessary practice for optimal UX.
In css-tricks.com's recent redesign, ...
