So you’ve created a nice form in SharePoint Designer, now you want to display some decent tooltips rather than the dull out of the box SharePoint field descriptions.

Here is a handy way to add JQuery tooltips direct to your form in an easy to manage way.

1) Open the form you have created in SharePoint Designer.
2) Create a new document libary and upload these two files.

3) Add a Content Editor Web Part to the page you want the tooltips to appear on.
4) Add the following code using the “Source Editor” button. Ensure you change the the path to the Jquery file syou uploaded a moment ago.

5) Add the following code with into your form page.

6) Use the following code in your form page to display tooltips.

The tooltip DIV can be defined anywhere on the page, and not necessarily directly below the anchor link.

7) You may wish to hide the content editor web part.

So how does the script know which anchor the tooltip should belong to?
It matches up the two based on the order in which they appear within the page’s source, so the 4th tooltip DIV will be associated with the 4th anchor link on the page, wherever both may appear on the page.