基于jQuery的消息提示插件之旅 DivAlert(三)


Posted in Javascript onApril 01, 2010

本版本遵循了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之旅(三) 推荐

Javascript 相关文章推荐
innerHTML与jquery里的html()区别介绍
Oct 12 Javascript
Js中setTimeout()和setInterval() 何时被调用执行的用法
Apr 12 Javascript
Eclipse去除js(JavaScript)验证错误
Feb 11 Javascript
使用jquery.qrcode生成彩色二维码实例
Aug 08 Javascript
jquery结合CSS使用validate实现漂亮的验证
Jan 29 Javascript
基于jquery实现左右按钮点击的图片切换效果
Jan 27 Javascript
js 获取范围内的随机数实例代码
Aug 02 Javascript
浅谈js中对象的使用
Aug 11 Javascript
使用Vue自定义指令实现Select组件
May 24 Javascript
vue生成token并保存到本地存储中
Jul 17 Javascript
微信小程序日历/日期选择插件使用方法详解
Dec 28 Javascript
JavaScript 闭包的使用场景
Sep 17 Javascript
基于jQuery的消息提示插件 DivAlert之旅(二)
Apr 01 #Javascript
基于jQuery的弹出消息插件 DivAlert之旅(一)
Apr 01 #Javascript
基于jquery的tab切换 js原理
Apr 01 #Javascript
JQuery 选项卡效果(JS与HTML的分离)
Apr 01 #Javascript
JQuery Tab选项卡效果代码改进版
Apr 01 #Javascript
JQuery autocomplete 使用手册
Apr 01 #Javascript
JavaScript 弹出窗体点击按钮返回选择数据的实现
Apr 01 #Javascript
You might like
PHP自动更新新闻DIY
2006/10/09 PHP
PHP入门
2006/10/09 PHP
PHP 冒泡排序算法的实现代码
2010/08/08 PHP
一个简单的PHP验证码实现代码
2014/05/10 PHP
PHP统计数值数组中出现频率最多的10个数字的方法
2015/04/20 PHP
非常好的js代码
2006/06/27 Javascript
给网站上的广告“加速”显示的方法
2007/04/08 Javascript
深入理解JavaScript高级之词法作用域和作用域链
2013/12/10 Javascript
JavaScript自定义日期格式化函数详细解析
2014/01/14 Javascript
JavaScript获取图片真实大小代码实例
2014/09/24 Javascript
使用jsonp完美解决跨域问题
2014/11/27 Javascript
jQuery实现自定义右键菜单的树状菜单效果
2015/09/02 Javascript
原生javascript实现自动更新的时间日期
2016/02/12 Javascript
jQuery事件与动画基础详解
2017/02/23 Javascript
详解如何webpack使用DllPlugin
2018/09/30 Javascript
详解vue-cli 脚手架 安装
2019/04/16 Javascript
Vue数字输入框组件示例代码详解
2020/01/15 Javascript
Python警察与小偷的实现之一客户端与服务端通信实例
2014/10/09 Python
解决pycharm无法调用pip安装的包问题
2018/05/18 Python
有关Python的22个编程技巧
2018/08/29 Python
python覆盖写入,追加写入的实例
2019/06/26 Python
解决Pytorch 加载训练好的模型 遇到的error问题
2020/01/10 Python
python GUI库图形界面开发之PyQt5线程类QThread详细使用方法
2020/02/26 Python
Python3 利用face_recognition实现人脸识别的方法
2020/03/13 Python
Python pip安装第三方库实现过程解析
2020/07/09 Python
Forever 21美国官网:美国标志性快时尚品牌
2017/02/20 全球购物
美国床垫和床上用品公司:Nest Bedding
2017/06/12 全球购物
全球在线商店:BerryLook
2019/04/14 全球购物
介绍一下SQL中union,intersect和minus
2012/04/05 面试题
介绍一下Python下range()函数的用法
2013/11/07 面试题
一百多行代码实现react拖拽hooks
2021/03/23 Javascript
品酒会策划方案
2014/05/26 职场文书
英语教育专业自荐信
2014/05/29 职场文书
2016教师校本研修心得体会
2016/01/08 职场文书
中国现代文学之经典散文三篇
2019/09/18 职场文书
一篇文章带你复习java知识点
2021/06/28 Java/Android