jquery plug-in hiAlert implements web page dialog beautification_jquery

I am tired of the warning window of IE browser, accompanied by the fearful "boom" sound, which makes people feel as if something bad is about to happen. Nowadays, various browsers have different display effects on the pop-up warning box (alert), confirmation dialog box (confirm), and input box (prompt) of the web page. This article uses the hiAlert plug-in to unify the dialog box style of the web page for you.

The hiAlert plug-in is improved based on jquery.alerts. It includes several commonly used prompt boxes, and also provides gradient prompt bar effects and pop-up web page layer effects. It is currently compatible with all mainstream browsers.

How to use

hiAlert provides five methods to use:

1. hiAlert

hiAlert(content,title,callback);
The hiAlert method provides 3 parameters, content: content, title: dialog box title, callback: callback function, if none, do not write, such as:

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

2. hiConfirm

hiConfirm(content,title,callback);
The hiConfirm method provides 3 parameters, content: content, title: dialog box title, callback: callback function, if none, do not write, such as:

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

3. hiPrompt

hiPrompt(content,deinput,title,callback);
The hiConfirm method provides 4 parameters, content: content, deinput: default value of the input box, title: dialog box title, callback: callback function, if none, do not write, such as:

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

4. hiBox

hiBox(obj,title,w,h,submit,cancel,callback)
The hiBox method provides 7 parameters, obj: the object specified to be opened (the only object), that is, the object associated with the content displayed in the dialog box, title: title, w: width, h: height, submit: object in the content that can be set is "submit", if there is a callback, click here to return to the callback behavior, cancel: the cancel or close button object in the dialog box, callback: the callback function, such as:

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

5. hiOverAlert

hiOverAlert(content,timeout);
hiOverAlert is used to display the effect of the information prompt bar, similar to the effect in the article on this site. It provides two parameters, content: prompt content, timeout: prompt time, the default is 3000, which is 3 seconds. Such as:

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

Be sure to load the jQuery library and hiAlert plug-in, as well as the corresponding css style when using it. You can also modify the CSS to further beautify the dialog box. In addition, if you need to drag the dialog box effect, you need to load jquery.ui.draggable.js, you can learn more.

The above is the entire content of this article, I hope you all like it.