Working with HTML in tooltips

So far, we've covered how you can set up tooltips to appear on your pages, as well as style them. The latter presents us with a slight dilemma, though, as we have to rely on jQuery to add in CSS styles programmatically, which can be detrimental if we're aiming to maintain a progressive style of enhancement for our tooltips. There is a way around this; whilst it involves an element of jQuery, it does allow us to use HTML to generate our tooltips, making it far more flexible for our needs.

Tip

Use of HTML in your tooltips

Before we go any further, I should point out that use of this method introduces a security risk to your code; it is for this reason that the default usage of content was switched from allowing HTML to just plain text. Please use this at your own risk!

Remove the contents of the markup in tooltip9.html, and add in the following:

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla blandit mi quis imperdiet semper. Fusce vulputate...