基于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 相关文章推荐
javascript 播放器 控制
Jan 22 Javascript
jQuery实现设置、移除文本框默认值功能
Jan 13 Javascript
轻松学习jQuery插件EasyUI EasyUI创建CRUD应用
Nov 30 Javascript
纯JavaScript 实现flappy bird小游戏实例代码
Sep 27 Javascript
angular2倒计时组件使用详解
Jan 12 Javascript
js, jQuery实现全选、反选功能
Mar 08 Javascript
angularjs2中父子组件的数据传递的实例代码
Jul 05 Javascript
vue通过路由实现页面刷新的方法
Jan 25 Javascript
webpack4手动搭建Vue开发环境实现todoList项目的方法
May 16 Javascript
在Vue中实现随hash改变响应菜单高亮
Mar 09 Javascript
JavaScript实现优先级队列
Dec 06 Javascript
TypeScript实用技巧 Nominal Typing名义类型详解
Sep 23 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的简易冒泡法代码分享
2012/08/28 PHP
php加密解密实用类分享
2014/01/07 PHP
Laravel 5.5基于内置的Auth模块实现前后台登陆详解
2017/12/21 PHP
繁简字转换功能
2006/07/19 Javascript
跟着Jquery API学Jquery之一 选择器
2010/04/07 Javascript
jQuery版仿Path菜单效果
2011/12/15 Javascript
Javascript的常规数组和关联数组对比小结
2012/05/24 Javascript
jQuery学习笔记 更改jQuery对象
2012/09/19 Javascript
jquery隐藏标签和显示标签的实例
2013/11/11 Javascript
js数值计算时使用parseInt进行数据类型转换(jquery)
2014/10/07 Javascript
js实现div弹出层的方法
2014/11/20 Javascript
2种jQuery 实现刮刮卡效果
2015/02/01 Javascript
JS+CSS实现可拖动的弹出提示框
2015/02/16 Javascript
VUE JS 使用组件实现双向绑定的示例代码
2017/01/10 Javascript
利用jquery正则表达式在页面验证url网址输入是否正确
2017/04/04 jQuery
Vue.js通用应用框架-Nuxt.js的上手教程
2017/12/25 Javascript
vue.js中$set与数组更新方法
2018/03/08 Javascript
jQuery实现鼠标移入移出事件切换功能示例
2018/09/06 jQuery
vue-cli构建vue项目的步骤详解
2019/01/27 Javascript
[00:57]辉夜杯战队访谈宣传片—VG
2015/12/25 DOTA
[52:07]完美世界DOTA2联赛PWL S3 LBZS vs access 第二场 12.10
2020/12/13 DOTA
python 调用HBase的简单实例
2016/12/18 Python
python基础教程之匿名函数lambda
2017/01/17 Python
Python+pyplot绘制带文本标注的柱状图方法
2019/07/08 Python
django的csrf实现过程详解
2019/07/26 Python
vim自动补全插件YouCompleteMe(YCM)安装过程解析
2019/10/21 Python
TFRecord格式存储数据与队列读取实例
2020/01/21 Python
css3 transform导致子元素固定定位变成绝对定位的方法
2020/03/06 HTML / CSS
CSS3实现渐变背景兼容问题
2020/05/06 HTML / CSS
四年级学生评语大全
2014/04/21 职场文书
学生夜不归宿检讨书
2014/09/23 职场文书
检讨书范文300字
2015/01/28 职场文书
悬空寺导游词
2015/02/05 职场文书
教师网络培训心得体会
2016/01/09 职场文书
选择比努力更重要?这是长期以来对“努力”的最大误解
2019/07/12 职场文书
Java由浅入深通关抽象类与接口(下篇)
2022/04/26 Java/Android