基于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 Array(数组)相关方法简述
Jul 25 Javascript
限制文本框输入N个字符的js代码
May 13 Javascript
Jquery实现鼠标移上弹出提示框、移出消失思路及代码
May 19 Javascript
jQuery 追加元素的方法如append、prepend、before
Jan 16 Javascript
jQuery图片旋转插件jQueryRotate.js用法实例(附demo下载)
Jan 21 Javascript
AngularJs Understanding the Model Component
Sep 02 Javascript
关于Ajax的原理以及代码封装详解
Sep 08 Javascript
Vue中使用webpack别名的方法实例详解
Jun 19 Javascript
iView框架问题整理小结
Oct 16 Javascript
写一个Vue Popup组件
Feb 25 Javascript
taro开发微信小程序的实践
May 21 Javascript
vue axios post发送复杂对象问题
Jun 04 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 array_pop()数组函数将数组最后一个单元弹出(出栈)
2011/07/12 PHP
PHP CURL 内存泄露问题解决方法
2015/02/12 PHP
JQuery toggle使用分析
2009/11/16 Javascript
在VS2008中使用jQuery智能感应的方法
2010/12/30 Javascript
javascript中的变量作用域以及变量提升详细介绍
2013/10/24 Javascript
Javascript 多浏览器兼容总结(实战经验)
2013/10/30 Javascript
JavaScript获取表格(table)当前行的值、删除行、增加行
2015/07/03 Javascript
JS实现的自定义网页拖动类
2015/11/06 Javascript
BootStrap文件上传样式超好看【持续更新】
2016/05/10 Javascript
Javascript中级语法快速入手
2016/07/30 Javascript
深入浅析jQuery对象$.html
2016/08/22 Javascript
AngularJS使用ng-repeat指令实现下拉框
2016/08/23 Javascript
vue.js动画中的js钩子函数的实现
2018/07/06 Javascript
详解Vue+Element的动态表单,动态表格(后端发送配置,前端动态生成)
2019/04/20 Javascript
Vue之beforeEach非登录不能访问的实现(代码亲测)
2019/07/18 Javascript
vue+moment实现倒计时效果
2019/08/26 Javascript
JS图片懒加载的优点及实现原理
2020/01/10 Javascript
浅谈vue在html中出现{{}}的原因及解决方式
2020/11/16 Javascript
配置 Pycharm 默认 Test runner 的图文教程
2018/11/30 Python
django mysql数据库及图片上传接口详解
2019/07/18 Python
初次部署django+gunicorn+nginx的方法步骤
2019/09/11 Python
python使用itchat模块给心爱的人每天发天气预报
2019/11/25 Python
python如何基于redis实现ip代理池
2020/01/17 Python
Python安装tar.gz格式文件方法详解
2020/01/19 Python
基于python实现删除指定文件类型
2020/07/21 Python
canvas学习总结三之绘制路径-线段
2019/01/31 HTML / CSS
捷克体育用品购物网站:D-sport
2017/12/28 全球购物
Edwaybuy西班牙:小米在线商店
2019/12/04 全球购物
试解释COMMIT操作和ROLLBACK操作的语义
2014/07/25 面试题
2014年父亲节活动方案
2014/03/06 职场文书
2015年教师师德师风承诺书
2015/04/28 职场文书
导游词之河北邯郸
2019/09/12 职场文书
用Python制作灯光秀短视频的思路详解
2021/04/13 Python
Python实现Telnet自动连接检测密码的示例
2021/04/16 Python
SQL写法--行行比较
2021/08/23 SQL Server
vue-cli3.x配置全局的scss的时候报错问题及解决
2022/04/30 Vue.js