Are you a member? sign in or take a minute to sign up

Cancel
Member login
logo
Typography Typography

Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est At vero eos et accusam et justo duo dolores et ea rebum.

Tooltips

To add a tooltip to a link, span or div specify a unique id for your element. In this example we are going to use the id mytooltip on a button. So first I will create a button with the 'csbutton' class to give it a nice styling. Ensure you link has got a title which will be used as the caption of the tooltip

Secondly, I will add a piece of javascript code with reference to the mytooltip id within the script.js. You can specify your custom position offset, opacity and the animation effect within the javascript

  • HTML code

    <a id="mytooltip" class="csbutton spot-action">Button with Tooltip</a>
  • Javascript code

    $("a#mytooltip").tooltip({ effect: 'slide', opacity: 0.8, position: ['top', 'center'], offset: [0, 0] });

Result:

Button with Tooltip