基于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 相关文章推荐
多个iframe自动调整大小的问题
Sep 18 Javascript
js模仿hover的具体实现代码
Dec 30 Javascript
node.js中watch机制详解
Nov 17 Javascript
jQuery-1.9.1源码分析系列(十)事件系统之事件包装
Nov 20 Javascript
阻止表单提交按钮多次提交的完美解决方法
May 16 Javascript
前端程序员必须知道的高性能Javascript知识
Aug 24 Javascript
EsLint入门学习教程
Feb 17 Javascript
用vuex写了一个购物车H5页面的示例代码
Dec 04 Javascript
Vue中多个元素、组件的过渡及列表过渡的方法示例
Feb 13 Javascript
详解vue2.0模拟后台json数据
May 16 Javascript
在LayUI图片上传中,解决由跨域问题引起的请求接口错误的方法
Sep 24 Javascript
ES5 模拟 ES6 的 Symbol 实现私有成员功能示例
May 06 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 for 循环语句使用方法详细说明
2010/05/09 PHP
ThinkPHP通过AJAX返回JSON的两种实现方法
2014/12/18 PHP
yii2.0实现创建简单widgets示例
2016/07/18 PHP
thinkphp跨库操作的简单代码实例
2016/09/22 PHP
Centos7 Yum安装PHP7.2流程教程详解
2019/07/02 PHP
jquery怎样实现ajax联动框(一)
2013/03/08 Javascript
jquery 绑定回车动作扑捉回车键触发的事件
2014/03/26 Javascript
node.js中的fs.writeSync方法使用说明
2014/12/15 Javascript
JavaScript 实现打印,打印预览,打印设置
2014/12/30 Javascript
jquery实现简单的自动播放幻灯片效果
2015/06/13 Javascript
浅谈JavaScript中的作用域和闭包问题
2015/07/07 Javascript
详解JavaScript中常用的函数类型
2015/11/18 Javascript
JavaScript基于原型链的继承
2016/06/22 Javascript
jquery代码规范让代码越来越好看
2017/02/03 Javascript
JavaScript的for循环中嵌套一个点击事件的问题解决
2017/03/03 Javascript
Angular多选、全选、批量选择操作实例代码
2017/03/10 Javascript
vue.js移动端app之上拉加载以及下拉刷新实战
2017/09/11 Javascript
聊聊JS动画库 Velocity.js的使用
2018/03/13 Javascript
javascript实现文件拖拽事件
2018/03/29 Javascript
详解Node.js中path模块的resolve()和join()方法的区别
2018/10/29 Javascript
vue-i18n结合Element-ui的配置方法
2019/05/20 Javascript
PyQt5图形界面播放音乐的实例
2019/06/17 Python
Python文件路径名的操作方法
2019/10/30 Python
Django框架获取form表单数据方式总结
2020/04/22 Python
Python爬虫代理池搭建的方法步骤
2020/09/28 Python
python对输出的奇数偶数排序实例代码
2020/12/04 Python
世界上最具创新性的增强型知名运动品牌:Proviz
2018/04/03 全球购物
StubHub中国:购买和出售全球活动门票
2020/01/01 全球购物
土木工程专业个人求职信
2013/12/05 职场文书
应聘医药销售自荐书范文
2014/02/08 职场文书
政治学求职信
2014/06/03 职场文书
实现中国梦思想汇报2014
2014/09/13 职场文书
2014年环卫工作总结
2014/11/22 职场文书
优秀护士事迹材料
2014/12/25 职场文书
关于redisson缓存序列化几枚大坑说明
2021/08/04 Redis
python双向链表实例详解
2022/05/25 Python