基于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 相关文章推荐
TBCompressor js代码压缩
Jan 05 Javascript
让textarea自动调整大小的js代码
Apr 12 Javascript
解决Jquery鼠标经过不停滑动的问题
Mar 03 Javascript
jQuery实现自动调整字体大小的方法
Jun 15 Javascript
javascript中Date()函数在各浏览器中的显示效果
Jun 18 Javascript
JavaScript中函数表达式和函数声明及函数声明与函数表达式的不同
Nov 15 Javascript
JavaScript对象数组排序实例方法浅析
Jun 15 Javascript
客户端(vue框架)与服务器(koa框架)通信及服务器跨域配置详解
Aug 26 Javascript
微信小程序商品详情页的底部弹出框效果
Nov 16 Javascript
Vue 页面权限控制和登陆验证功能的实例代码
Jun 20 Javascript
ES6之Proxy的get方法详解
Oct 11 Javascript
node.js中stream流中可读流和可写流的实现与使用方法实例分析
Feb 13 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
dede全站URL静态化改造[070414更正]
2007/04/17 PHP
PHP使用递归算法无限遍历数组示例
2017/01/13 PHP
PHP中大括号'{}'用法实例总结
2017/02/08 PHP
通过 Dom 方法提高 innerHTML 性能
2008/03/26 Javascript
ExtJS 下拉多选框lovcombo
2010/05/19 Javascript
JS中的form.submit()不能提交表单的错误原因
2014/10/08 Javascript
js+jquery实现图片裁剪功能
2015/01/02 Javascript
javascript 动态修改css样式方法汇总(四种方法)
2015/08/27 Javascript
javascript同步服务器时间和同步倒计时小技巧
2015/09/24 Javascript
jQuery prototype冲突的2种解决方法(附demo示例下载)
2016/01/21 Javascript
jQuery验证插件validate使用详解
2016/05/11 Javascript
利用Jquery实现几款漂亮实用的时间轴(附示例代码)
2017/02/15 Javascript
require.js中的define函数详解
2017/07/10 Javascript
微信小程序自定义模态对话框实例详解
2017/08/16 Javascript
引入JavaScript时alert弹出框显示中文乱码问题
2017/09/16 Javascript
Swiper 4.x 使用方法(移动端网站的内容触摸滑动)
2018/05/17 Javascript
vue实现移动端悬浮窗效果
2018/12/01 Javascript
详解vuex commit保存数据技巧
2018/12/25 Javascript
Elasticsearch实现复合查询高亮结果功能
2019/09/10 Javascript
Vue 实现点击空白处隐藏某节点的三种方式(指令、普通、遮罩)
2019/10/23 Javascript
JS面向对象编程基础篇(三) 继承操作实例详解
2020/03/03 Javascript
JavaScript 双向链表操作实例分析【创建、增加、查找、删除等】
2020/04/28 Javascript
python模块smtplib学习
2018/05/22 Python
python实现自动登录
2018/09/17 Python
对python for 文件指定行读写操作详解
2018/12/29 Python
python算法题 链表反转详解
2019/07/02 Python
Python StringIO及BytesIO包使用方法解析
2020/06/15 Python
用html5的canvas画布绘制贝塞尔曲线完整代码
2013/08/14 HTML / CSS
HTML5 Canvas玩转酷炫大波浪进度图效果实例(附demo)
2016/12/14 HTML / CSS
幼儿园2014年度工作总结
2014/11/10 职场文书
答谢词范文
2015/01/05 职场文书
2015年世界粮食日演讲稿
2015/03/20 职场文书
2016年党员读书月活动总结
2016/04/06 职场文书
2019银行员工个人工作自我鉴定
2019/06/27 职场文书
5种方法告诉你如何使JavaScript 代码库更干净
2021/09/15 Javascript
mysql下的max_allowed_packet参数设置详解
2022/02/12 MySQL