基于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脚本
Aug 04 Javascript
JavaScript中的Document文档对象
Jan 16 Javascript
jquery load()在firefox(火狐)下显示不正常的解决方法
Apr 05 Javascript
javascript版2048小游戏
Mar 18 Javascript
JS实用的动画弹出层效果实例
May 05 Javascript
js简单时间比较的方法
Aug 02 Javascript
javascript作用域链与执行环境详解
Mar 25 Javascript
JavaScript变量类型以及变量作用域详解
Aug 14 Javascript
JavaScript实现各种排序的代码详解
Aug 28 Javascript
浅谈函数调用的不同方式,以及this的指向
Sep 17 Javascript
利用Javascript获取选择文本所在的句子详解
Dec 03 Javascript
vue2之简易的pc端短信验证码的问题及处理方法
Jun 03 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实现文件下载实例分享
2014/06/02 PHP
php中单个数据库字段多列显示(单字段分页、横向输出)
2014/07/28 PHP
PHP配置把错误日志以邮件方式发送方法(Windows系统)
2015/06/23 PHP
PDO::query讲解
2019/01/29 PHP
两个比较有用的Javascript工具函数代码
2010/02/17 Javascript
javascrip客户端验证文件大小及文件类型并重置上传
2011/01/12 Javascript
jquery中实现简单的tabs插件功能的代码
2011/03/02 Javascript
javascript级联下拉列表实例代码(自写)
2013/05/10 Javascript
简洁Ajax函数处理(示例代码)
2013/11/15 Javascript
JavaScript编写点击查看大图的页面半透明遮罩层效果实例
2016/05/09 Javascript
js HTML5上传示例代码完整版
2016/10/10 Javascript
第一次接触神奇的Bootstrap
2016/10/14 Javascript
JS 在数组指定位置插入/删除数据的方法
2017/01/12 Javascript
angularJS之$http:与服务器交互示例
2017/03/17 Javascript
vue系列之动态路由详解【原创】
2017/09/10 Javascript
JavaScript实现离开页面前提示功能【附jQuery实现方法】
2017/09/26 jQuery
js实现购物车功能
2018/06/12 Javascript
详解基于Vue-cli搭建的项目如何和后台交互
2018/06/29 Javascript
React注册倒计时功能的实现
2018/09/06 Javascript
详解BootStrap表单验证中重置BootStrap-select验证提示不清除的坑
2019/09/17 Javascript
vue.js循环radio的实例
2019/11/07 Javascript
nodejs中的异步编程知识点详解
2021/01/17 NodeJs
python脚本实现分析dns日志并对受访域名排行
2014/09/18 Python
Python cookbook(数据结构与算法)通过公共键对字典列表排序算法示例
2018/03/15 Python
对tf.reduce_sum tensorflow维度上的操作详解
2018/07/26 Python
python内置模块collections知识点总结
2019/12/19 Python
pyCharm 实现关闭代码检查
2020/06/09 Python
做一个能自适应高度的textarea的示例代码
2019/09/06 HTML / CSS
Omio美国:全欧洲低价大巴、火车和航班搜索和比价
2017/11/08 全球购物
Servlet都有哪些方法?主要作用是什么?
2014/03/04 面试题
小学生三分钟演讲稿
2014/08/18 职场文书
助人为乐好少年事迹材料
2014/08/18 职场文书
一般基层干部群众路线教育实践活动个人对照检查材料
2014/11/04 职场文书
2015年高一班主任工作总结
2015/05/13 职场文书
观看焦裕禄观后感
2015/06/09 职场文书
Windows Server 2019 安装DHCP服务及相关配置
2022/04/28 Servers