Bootstrap FreeKB - HTML - Create a fancy tooltip using Tipped
HTML - Create a fancy tooltip using Tipped

Updated:   |  HTML articles

Tipped is software that allows you to create much fancier Tooltips.

  1. Download the light version of Tipped from http://www.tippedjs.com/download.
  2. Go to your Downloads folder.
  3. Extract the tipped-version-light.zip folder.
  4. Inside the unzipped folder are subfolders css, example,and  js). Move the contents of each of these folders to the matching folders on your Web server.

To use Tipped, add the following to the HEAD of your Web page.

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="/js/tipped/tipped.js"></script>
<link rel="stylesheet" type="text/css" href="/css/tipped/tipped.css"/>

 

Then use the following code so that your tooltips are fancy.

<span class="first-tooltip" title="Hello World">The human says</span>
<span class="first-tooltip" title="Hello Lifeform">The Earth responds</span>

<script type="text/javascript">
  $(document).ready(function() {
    Tipped.create('.first-tooltip');
  });
</script>	

http://www.tippedjs.com/documentation




Did you find this article helpful?

If so, consider buying me a coffee over at Buy Me A Coffee



Comments


Add a Comment


Please enter 56108f in the box below so that we can be sure you are a human.