php里提示框插件,JavaScript_jQuery消息提示框插件Tipso，今天我们用Tipso插件来演示八 - phpStudy...

jQuery消息提示框插件Tipso

今天我们用Tipso插件来演示八种不同提示效果，并且了解下Tipso API。

1、默认

Tipso

演示一：默认效果

$('#tip1').tipso({

useTitle: false

});

演示二：左侧显示

$('#tip2').tipso({

useTitle: false,

position: 'left'

});

演示三：背景颜色

$('#tip3').tipso({

useTitle: false,

background: 'tomato'

});

演示四：使用title属性

$('#tip4').tipso();

演示五：单击显示/隐藏

$('#tip5').tipso({

useTitle: false

});

$('#btn5').on({

click: function(e) {

if ($(this).text() == '显示') {

$(this).text('隐藏');

$('#tip5').tipso('show');

} else {

$(this).text('显示');

$('#tip5').tipso('hide');

}

e.preventDefault();

}

});

演示六：更新内容

$('#tip6').tipso({

useTitle: false

});

$('#btn6').on('click', function() {

var $val = $(this).prev().val();

if ($val) {

$('#tip6').tipso('update', 'content', $val);

}

});

演示七：在图片上使用

$('#tip7').tipso({

useTitle: false

});

演示八：回调函数

$('#tip8').tipso({

useTitle: false,

onBeforeShow: function() {

$('#status').html('beforeShow');

},

onShow: function() {

$('#status').html('show');

},

onHide: function() {

$('#status').html('hide');

}

});

以上所述就是本文的全部内容了，希望大家能够喜欢。相关阅读:

PHP合并静态文件详解

Android打开相机和相册实例代码

php遍历树的常用方法汇总

PHP经典面试题集锦

CSS div布局需要注意的两点

Node.js编写爬虫的基本思路及抓取百度图片的实例分享

Oracle SQL Developer显示的时间包含时分秒的设置方法

js形成页面的一种遮罩效果实例代码

mysql启用skip-name-resolve模式时出现Warning的处理办法

css弹出层覆盖底层具体实现

纯CSS实现鼠标滑过显示子菜单的二级菜单效果

css控制背景示例(css设置背景图片、设置背景颜色)

oracle删除已存在的表的实例

C#使用foreach语句搜索数组元素的方法