jquery Plugin CSS3 Animation simulation confirm pop-up window

Source: Internet
Author: User

Compared to the browser's own alert, confirm, and capabilities, I prefer that everything is custom:
First of all in the head tag (of course, like other places to look at) the introduction of plug-in style sheets and JS.
<link rel= "stylesheet" href= "Css/weiconfirm.css"/>-if you can, you can modify the UI yourself
<script type= "Text/javascript" src= "Js/jquery.js" ></script>-must first introduce jquery
<script type= "Text/javascript" src= "js/weiconfirm.js" ></script>-introduced plugin JS

The next step is to invoke the method, first look at the beautiful effect:


The above image effect is calledMethod of Use:
<script>
$ (function () {
$.confirm (' I'm a pretty confirm pop-up window with CSS3 animation Oh ', function () {
$.confirm (' You clicked OK ')
});
});
</script>

Next details the effect of the call when the parameters are different:
Default-The title is: "Warm tips】
-Buttons are "OK" and "Cancel" respectively
-the other 3 parameters are empty, total 6 parameters

parameter is 1, parameter is information content
$.confirm (' I am a beautiful confirm-pop window ');



The parameters are 2, the previous one is the content, and the next one is the function executed after clicking "OK"
$.confirm (' I'm a pretty confirm pop-up window ', function () {
Alert (' Click OK to execute function ')
});

The parameter is 3, the first is the content, the second is the function executed after clicking "OK", and the third is the function that executes after clicking "Cancel".
$.confirm (' I'm a pretty confirm pop-up window ', function () {
Alert (' Click OK to execute function ')
},function () {
Alert (' function executed after clicking Cancel ')
});

The parameter is 4, the first is the content, the second is the value that defaults to OK, and the third is a clickFunctions executed after "OK", fourth is the function executed after clicking "Cancel"
$.confirm (' I'm a pretty confirm pop-up window ', ' or OK ', function () {
Alert (' Click or OK to execute function ')
},function () {
Alert (' function executed after clicking Cancel ')
});



The remaining is the parameter of 6, do not explain, look below, very good understanding
$.confirm (' title haha ', ' content haha ', ' OK haha ', ' cancel haha ', function () {
Alert (' You clicked OK haha ');
},function () {
Alert (' You clicked cancel haha ');
});


Compatibility:
reluctantly compatible with IE8, originally good effect have not thought of compatible with IE, let alone IE6.

Plugin Download:
HTTP://PAN.BAIDU.COM/S/1GDFYPTP (source is not compressed, welcome to Exchange discussion study)

And also:

Do not know the code to write good, I hope the great God can advise the O (∩_∩) o Ah!

jquery Plugin CSS3 Animation simulation confirm pop-up window

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.