Tipso 轻巧的jQuery提示插件

Tipso是一款基于jQuery的Tooltip提示框插件,他提供了众多参数,如显示动画持续时间、背景颜色、文本颜色、显示位置、加载ajax内容、回调函数等等。

 

默认

<button class="tipso" data-tipso-content="Hello hooHtml.Com">Tipso</button>
  1. JS
$('.tipso').tipso();

 

左边显示

  1. JS
$('.tipso2').tipso({position:'left'});

 

更换背景颜色,并隐藏箭头

  1. JS
$('.tipso3').tipso({ 
    background:'tomato'
    showArrow:false 
});

 

Ajax

  1. JS
$('.tipso-ajax').tipso({
    background: 'tomato',
    useTitle: false,
    ajaxContentUrl : 'ajax.htm'
});

 

移除Tipso

这里有个Tipso

  1. JS
$('.tipso-destroy').on('click'function(e){
    $('.destroy').tipso('destroy');
    e.preventDefault();
});

 

onShow和onHide 回调函数

  1. JS
$('.callback-tipso').tipso({
  onShow: function(){
    alert('Tipso Showed');
  },
  onHide: function(){
    alert('Tipso Hidden');
  }
});