基于jQuery的消息提示插件之旅 DivAlert(三)
2024-05-06 14:10:44
供稿:網友
本版本遵循了2.0的寫法,此處通過extend方法封裝了需要設置的各個選項,比起2.0版本的代碼要精簡了一些。
2.0版本
代碼如下:
//設置插件基本信息
var options = o || {};
options.width = o.width || 300;
//提示框寬度若小于104px則自動重置為200px
if (options.height > 104) {
options.height = o.height;
} else {
options.height = 200;
}
options.title = o.title || "提示標題";
options.content = o.content || "提示內容";
//與css文件結合,方便在外部自定義樣式而不用改寫js文件
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版本
代碼如下:
//設置插件基本信息
var settings = {
width: 300,
height: 200,
title: "提示標題",
content: "提示內容",
bgClass: 'jBg',
wrapClass: 'jWrap',
titClass: 'jTit',
conClass: 'jCon',
clsClass: 'jBtn',
botDivClass: 'jBot',
botBtnClass: 'jBotBtn'
};
$.extend(settings, options);
都是些很基礎的東西,不過還是打個包吧,有興趣的可以下來瞧瞧。。。
完整代碼打包下載
作者:Rocky翔(cnblogs)
感謝作者的代碼,錯新站長站編輯簡單的說明下,從剛開始的第一版的不完善到完善,都是一步一步過來的,開始沒有什么是完美的,經過參考別人的代碼,學習別人的長處,慢慢的就會讓你的程序更完善,建議大家在以后學習的過程中,多參考多寫,不要只看不動手,多多動手自己寫代碼,才能真正的學習到知識,發現自己的不足。
下面附上作者前兩期發布的文章
基于jQuery的彈出消息插件 DivAlert之旅(一)
基于jQuery的消息提示插件 DivAlert之旅(二)
基于jQuery的消息提示插件 DivAlert之旅(三) 推薦