Home >Web Front-end >JS Tutorial >Journey of message prompt plug-in based on jQuery DivAlert (3)_jquery

Journey of message prompt plug-in based on jQuery DivAlert (3)_jquery

WBOY
WBOYOriginal
2016-05-16 18:30:38958browse

This version follows the writing method of 2.0. Here, the various options that need to be set are encapsulated through the extend method, which is simpler than the code of version 2.0.
 
Version 2.0

Copy code The code is as follows:

//Set the basic information of the plug-in
var options = o || {};
options.width = o.width || 300;
//If the width of the prompt box is less than 104px, it will be automatically reset to 200px
if (options.height > 104) {
options.height = o.height;
} else {
options.height = 200;
}
options.title = o.title || "Prompt title";
options.content = o.content || "Prompt content";
//Combined with css files to facilitate external customization of styles without rewriting js files
options.bgClass = o.bgClass || 'jBg';
options.wrapClass = o.wrapClass || 'jWrap';
options.titClass = o.titClass || 'jTit';
options.conClass = o.conClass || 'jCon';
options.clsClass = o.clsClass || 'jBtn';
options.botDivClass = o.botDivClass || 'jBot';
options. botBtnClass = o.botBtnClass || 'jBotBtn';

3.0 version
Copy code The code is as follows:

//Set the basic information of the plug-in
var settings = {
width: 300,
height: 200,
title: "Prompt Title",
content: "prompt content",
bgClass: 'jBg',
wrapClass: 'jWrap',
titClass: 'jTit',
conClass: 'jCon',
clsClass: 'jBtn',
botDivClass: 'jBot',
botBtnClass: 'jBotBtn'
};
$.extend(settings, options);

These are very basic things, but I’d better pack them up. If you are interested, you can come down and take a look. . .
Full code package download

Author: Rocky Xiang (cnblogs)
Thanks to the author for the code, the editor of Script House gave a simple explanation, starting from the first version It is a step-by-step process from imperfection to perfection. Nothing is perfect at the beginning. By referring to other people's codes and learning other people's strengths, your program will gradually become more perfect. I recommend that you learn in the future. , refer to it more and write more, don't just watch and write the code yourself, only then can you truly learn the knowledge and discover your own shortcomings.
Attached below are the articles published by the author in the first two issues
Journey to jQuery-based pop-up message plug-in DivAlert (1)

JQuery-based message prompt plug-in DivAlert Journey (2)

jQuery-based message prompt plug-in DivAlert Journey (3) Recommended
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn