Finishing the Tooltip

Let's wrap up the tooltip by rendering the information inside the tooltip.

We are going to finish the tooltip. We have confirmed we have the correct information by repositioning the tooltip circle on the line. There is another UI element we are going to need to update, which is the tooltip itself. The tooltip will display the date and price, and it will be positioned above the dot. Let’s get started.

Tooltip position

We will be working in the event handler function. We are going to make the tooltip visible by setting its display CSS property to block. The selection for the tooltip is stored under the tooltip variable. We will chain the style() function to change this CSS property.

Get hands-on with 1200+ tech skills courses.