<link rel="stylesheet" type="text/css" href="/css/tooltipster.css" />
<script type="text/javascript" src="/js/jquery.tooltipster.js"></script>

<script>
$('[title]').tooltipster();
</script>

$('[title]').tooltipster({
  animation: 'fall', // Анимация: (fade, grow, swing, slide, fall)
  arrow: true, // Показывать ли стрелочку
  arrowColor: '', // Цвет стрелочки (hex code / rgb)
  content: '', // Содержимое по-умолчанию (string, jQuery object)
  delay: 200, // задержка перед появлением
  fixedWidth: 0, // Фиксированная ширина
  maxWidth: 200, // Максимальная ширина
  functionBefore: function (origin, continueTooltip) {
  continueTooltip(); // Функции до открытия подсказки
  },
  functionReady: function (origin, tooltip) {
  // Функция после открытия подсказки
  },
  functionAfter: function (origin) {
  // Функция после закрытия подсказки
  },
  icon: '(?)', // Иконка (string)
  iconDesktop: false, // Генерировать ли иконку рядом с объектом для запуска подсказки
  iconTouch: false, // Генерировать ли иконку рядом с объектом для запуска подсказки для мультитач устройств
  iconTheme: '.tooltipster-icon', // Класс для иконки - подсказки
  interactive: false, // Закрывать ли подсказку сразу после отведения курсора. Если true - курсор можно будет водить и по самой подсказке
  interactiveTolerance: 350, // На сколько долго подсказка не спрячется после отвода курсора
  offsetX: 0,
  offsetY: 0,
  onlyOne: true, // Разрешёна ли только одна активная подсказка
  position: 'top', // Где подсказка появится по-умолчанию (right, left, top, top-right, top-left, bottom, bottom-right, bottom-left)
  speed: 350, // Скорость анимации
  timer: 0, // Через сколько времени подсказка сама закроется
  theme: '.tooltipster-default', // Цветовая схема
  touchDevices: true, // Активирована для мультитач устройств
  trigger: 'hover', // При каком событии открывать подсказку (hover, click, custom)
  updateAnimation: true // Анимировать ли подсказку, когда в ней меняется контент
  });

// Открыть подсказку
$('.класс').tooltipster('show');

// Закрыть подсказку
$(.класс).tooltipster('hide');

// Отключить подсказку
$(.класс).tooltipster('disable');

// Включить подсказку
$(.класс).tooltipster('enable');

// Закрыть и удалить подсказку
$(.класс).tooltipster('destroy');

// Обновить контент внутри подсказки
$(.класс).tooltipster('update', 'Новый текст или html код');

// Изменить позицию и размер подсказки
$(.класс).tooltipster('reposition');

$('.класс').tooltipster({
  theme: '.tooltipster-light'
});