欢迎访问

云南鼎浩信息技术有限公司官方网站,云南网站建设诚信品牌!

鼎浩网络,云南鼎浩信息技术有限公司

鼎浩客服热线

DING HAO COLUMN 鼎浩专栏

鼎浩的一些分享
Sharing from Ding Hao

  • 鼎浩服务
  • 1

jNotify:操作结果信息提示条

来源:     2013年07月02日17:02
字号:T|T

我们在提交表单后,通过Ajax响应后台返回结果,并在前台显示返回信息,jNotify能非常优雅的显示操作结果信息。jNotify是一款基于jQuery的信息提示插件,它支持操作成功、操作失败和操作提醒三种信息提示方式。

查看演示DEMO 下载源码

jNotify具有以下特性::

  • 跨浏览器兼容。
  • 提示内容支持HTML标签。
  • 支持定位提示框的位置。
  • 灵活的,可配置插件参数。

使用前准备

使用该插件时一定要记得先载入jQuery库和该插件以及相关样式。


jQuery

jNotify的使用很非常简单。

$(function(){
   $(element).click(function(){
       jSuccess(message,{option});
   });  
});

jNotify提供三种调用方式,分别是jSuccess(),jNotify(),jError(),使用方法都一样。message就是提示信息的内容,支持html标签。option是参数配置项,可以进行相关配置,如果不要option则采用默认配置。

jNotify提供以下可配置的参数:

autoHide : true,				// 是否自动隐藏提示条
clickOverlay : false,			// 是否单击遮罩层才关闭提示条
MinWidth : 200,					// 最小宽度
TimeShown : 1500, 				// 显示时间:毫秒
ShowTimeEffect : 200, 			// 显示到页面上所需时间:毫秒
HideTimeEffect : 200, 			// 从页面上消失所需时间:毫秒
LongTrip : 15,					// 当提示条显示和隐藏时的位移
HorizontalPosition : "right", 	// 水平位置:left, center, right
VerticalPosition : "bottom",	 // 垂直位置:top, center, bottom
ShowOverlay : true,				// 是否显示遮罩层
ColorOverlay : "#000",			// 设置遮罩层的颜色
OpacityOverlay : 0.3,			// 设置遮罩层的透明度

此外jNotify还提供了两个方法操作onClosed和onCompleted,使用方法可参照DEMO。

您还可以修改CSS样式来呈现提示信息条的外观。

客服中心
点击进行在线咨询

QQ咨询 咨询QQ:79929313 咨询QQ:88139574 咨询QQ:122790803

咨询热线:0871-63399840

客服热线:0871-63523332

客服中心 客服中心