栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

jquery插件hiAlert实现网页对话框美化

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

jquery插件hiAlert实现网页对话框美化

厌烦了IE浏览器的警告窗,伴随着“咚”恐惧的一声,让人感觉好像有一种坏事情即将来临。而如今各浏览器对网页的弹出警告框(alert)、确认对话框(/confirm/i)、输入框(prompt)显示效果不一,本文借助hialert插件来为您统一网页的对话框风格。

hialert插件是根据 jquery.alerts 改进得来,包括了常用的几种提示框,还提供了渐变提示条效果,弹出网页层效果,它目前兼容各主流浏览器。

使用方法

hialert提供了五种方法可以使用:

1、hialert

hialert(content,title,callback);
hialert方法提供3个参数,content:内容,title:对话框标题,callback:回调函数,若无则不写,如:

hialert("欢迎来到helloweba.com","提示"); 

2、hi/confirm/i

hiConfirm(content,title,callback);
hi/confirm/i方法提供3个参数,content:内容,title:对话框标题,callback:回调函数,若无则不写,如:

hiConfirm('你确认此操作吗?','确认框',function(r){ 
  hiOveralert('你的反馈是: ' + r); 
}); 

3、hiprompt

hiprompt(content,deinput,title,callback);
hi/confirm/i方法提供4个参数,content:内容,deinput:输入框的默认值,title:对话框标题,callback:回调函数,若无则不写,如:

hiprompt('请填写:','默认值','输入框',function(r){ 
  if(r) hiOveralert('你填入的内容是“' + r+'”'); 
}); 

4、hiBox

hiBox(obj,title,w,h,submit,cancel,callback)
hiBox方法提供7个参数,obj: 被指定打开的对象(对象唯一),即对话框中展示的内容关联的对象,title:标题,w:宽度,h:高度,submit:可设置内容中的对象为"submit",如果有callback,点此返回callback行为,cancel:对话框中的取消或关闭按钮对象,callback:回调函数,如:

hiBox('#showbox', '标题',400,'','','.a_close'); 

5、hiOveralert

hiOveralert(content,timeout);
hiOveralert用来展示信息提示条效果,类似本站文章中的效果,它提供了两个参数,content:提示内容,timeout:提示时间,默认为3000,即3秒。如:

hiOveralert('操作提示条信息',1500); 

在使用时一定记得加载jQuery库和hialert插件,以及对应的css样式。您也可以修改CSS来进一步美化对话框。此外,如果需要拖动对话框效果,则需要载入jquery.ui.draggable.js,可以到了解详情。

以上所述就是本文的全部内容了,希望大家能够喜欢。

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/102737.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号