手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >基于jQuery的message插件实现右下角弹出消息框
基于jQuery的message插件实现右下角弹出消息框
摘要:1.$.messager.lays(width,height);该方法主要用来定义弹出窗口的宽度和高度。2.$.messager.anim(...

1.$.messager.lays(width, height);

该方法主要用来定义弹出窗口的宽度和高度。

2.$.messager.anim(type,speed);

该方法主要定义窗口以什么样的方式和速度呈现。

$.messager.anim("fade",1000); //以fadeIn的动画方式显示

$.messager.anim("show",1000); //以show的动画方式显示

3.$.messager.show(title,text,time);

该方法主要定义窗口显示的内容,以及窗口显示多长时间后进行隐藏。

如果使用默认的标题,则将title设置为0,另外title和text还可以设置为html内容进行显示。如果希望用户点击弹窗的关闭按钮才关闭消息框,可将time设置为0。

$.messager.show(0, "这是一个提示框",5000);

$.messager.show("<font color='red'>提示信息</font>","<a href='http://www.cnblogs.com'>博客园欢迎你</a>",3000);

在明白了message插件中每个方法的作用后,使用起来就很简单了,具体操作如下:

1.在页面引入jquery.js和jquery.messager.js文件。

2.在页面加载的时候调用message插件中的函数,设置窗口的大小,显示效果,以及显示内容。

复制代码 代码如下:

$(function () {

$.messager.lays(200, 200);

$.messager.anim('fade', 1000);

$.messager.show("提示信息", "<a href='http://www.jb51.net'>查字典教程网</a>",5000);

});

3.最后显示的效果如下图。

在线演示地址 http://demo.jb51.net/js/jquery.messager/index.html

插件下载:jquery.message.js打包下载地址 http://www.jb51.net/jiaoben/22351.html

【基于jQuery的message插件实现右下角弹出消息框】相关文章:

jquery实现图片左右切换的方法

jQuery实现控制文字内容溢出用省略号(…)表示的方法

jquery读取xml文件实现省市县三级联动的方法

jQuery插件zepto.js简单实现tab切换

js操作css属性实现div层展开关闭效果的方法

基于JavaScript实现图片点击弹出窗口而不是保存

jQuery插件支持同一页面被多次调用

jQuery Timelinr实现垂直水平时间轴插件(附源码下载)

jquery实现动态改变div宽度和高度

js实现鼠标移到链接文字弹出一个提示层的方法

精品推荐
分类导航