Before you begin
We created a bootstrap 3 page in Dreamweaver. Keep in mind that in order to use DMXzone Bootstrap 3 Components you need to have DMXzone Bootstrap 3 installed in your Dreamweaver.
Add a tooltip
We'd like to add nice tooltips to the images on the page. We are working in live view, but if you prefer, you can work in Design view also. Select the element (1), that you want to add a tooltip to. In our case this is the first image in the gallery. Then, check the show tooltip checkbox (2) in the Bootstrap 3 Components panel.
Now, add the text for the tooltip (1). You can use html tags in the tooltip text field. If the tootltip text contains any HTML tags, you must check the HTML checkbox. Select whether the tooltip should fade in and out (2) or not.
Customize the appearance
Select a position for the tooltip. Four options are available: top, right, bottom, and left aligned. We choose top (1). Now, choose how to trigger the tooltip. We select on hover and focus (2). You can add a delay when showing and hiding the tooltip. This must be a numeric value in milliseconds.
Save and preview
You can see the nice animated tooltip, that appears when we hover the image. That's how easy it is to add tooltips on your page, using DMXzone Bootstrap 3 Components.