A tooltip provides extra information about a form field, a link, a button, or other focusable element. It must be triggered by both focus and hover events and remains on the screen as long as the trigger has the focus. The focus does not move to the tooltip.
Turn on a screen reader to experience this example in action.
Lorem ipsum sit amet, consectetur adipiscing elit. Donec Link 3 gravida neque vel magna vestibulum, id euismod libero lobortis. Pellentesque egestas egestas tortor, sed fringilla purus malesuada eget. In commodo semper pharetra. In a pharetra magna. Praesent quis justo eget dolor sollicitudin mollis eu a ex. Curabitur maximus turpis et ligula pretium gravida. Nam lacinia sed lorem non vulputate. Nulla eget quam venenatis augue euismod viverra in id enim. Cras viverra mi eget dapibus finibus. Donec nec arcu elementum, pellentesque ante ut, viverra ipsum.
Lorem ipsum sit amet, consectetur adipiscing elit. Donec gravida neque vel magna vestibulum, id euismod libero lobortis. Pellentesque egestas egestas tortor, sed fringilla purus malesuada eget. In commodo semper pharetra. In a pharetra magna. Praesent quis justo eget dolor sollicitudin mollis eu a ex. Curabitur maximus turpis et ligula pretium gravida. Nam lacinia sed lorem non vulputate. Nulla eget quam venenatis augue euismod viverra in id enim. Cras viverra mi eget dapibus finibus. Donec nec arcu elementum, pellentesque ante ut, viverra ipsum.