Success Criterion 1.4.13 - Level AA
Content on Hover or Focus
Ensure it is possible to hide information which appears automatically after hovering with the pointer or focusing with the keyboard. It often happens that an element is interacted with accidentally. If new content appears, it may affect the completion of a task. Automatic content mainly causes problems for users of external input devices.
Impact
Users can get stuck in an app if it is not possible to hide automatically appearing content.
A menu may open after ho. Users should be able to stop or undo this action.
Check
“Can content be hidden if it gets in the way?“
You can use a pointer of keyboard to check this.
Solution
Add a close button to content that is automatically displayed to allow users to hide it.
Add close button
On Android, you can show a dialog by using AlertDialog
, BottomSheetDialog
or DialogFragment
. You should always add a close button by using the setNegativeButton
method. The focus of assistive technologies is automatically trapped inside the dialog while it's visible.
val builder = AlertDialog.Builder(this)
builder.setTitle("Confirm Appt membership?")
builder.setMessage("Your bank account will be billed.")
builder.setPositiveButton("Proceed") { dialog, which ->
// Proceed
}
builder.setNegativeButton("Cancel") { dialog, which ->
// Cancel
}
builder.show()