基于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 相关文章推荐
jquery拖动插件(jquery.drag)使用介绍
Jun 18 Javascript
jquery实现带复选框的表格行选中删除时高亮显示
Aug 01 Javascript
jsMind通过鼠标拖拽的方式调整节点位置
Apr 13 Javascript
jQuery插件slides实现无缝轮播图特效
Apr 17 Javascript
JS根据key值获取URL中的参数值及把URL的参数转换成json对象
Aug 26 Javascript
详解jQuery移动页面开发中的ui-grid网格布局使用
Dec 03 Javascript
BootStrap轻松实现微信页面开发代码分享
Oct 21 Javascript
详解微信小程序开发—你期待的分享功能来了,微信小程序序新增5大功能
Dec 23 Javascript
ReactNative 之FlatList使用及踩坑封装总结
Nov 29 Javascript
自定义PC微信扫码登录样式写法
Dec 12 Javascript
少女风vue组件库的制作全过程
May 15 Javascript
JS开发常用工具函数(小结)
Jul 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
深入了解php4(2)--重访过去
2006/10/09 PHP
iframe的onload在Chrome/Opera中执行两次Bug的解决方法
2011/03/17 Javascript
jQuery源码分析-04 选择器-Sizzle-工作原理分析
2011/11/14 Javascript
JavaScript实现复制功能各浏览器支持情况实测
2013/07/18 Javascript
js与jquery获取父级元素,子级元素,兄弟元素的实现方法
2014/01/09 Javascript
js和jquery如何获取图片真实的宽度和高度
2014/09/28 Javascript
JavaScript不使用prototype和new实现继承机制
2014/12/29 Javascript
Javascript通过overflow控制列表闭合与展开的方法
2015/05/15 Javascript
JS实现左右无缝轮播图代码
2016/05/01 Javascript
拥Bootstrap入怀——导航栏篇
2016/05/30 Javascript
jQuery mobile在页面加载时添加加载中效果 document.ready 和window.onload执行顺序比较
2016/07/14 Javascript
KnockoutJS 3.X API 第四章之事件event绑定
2016/10/10 Javascript
js自定义QQ菜单效果
2017/01/10 Javascript
Vue.js学习示例分享
2017/02/05 Javascript
解决webpack无法通过IP地址访问localhost的问题
2018/02/22 Javascript
用JS实现根据当前时间随机生成流水号或者订单号
2018/05/31 Javascript
JavaScript实现汉字转换为拼音及缩写的方法示例
2019/03/28 Javascript
js的继承方法小结(prototype、call、apply)(推荐)
2019/04/17 Javascript
elementUI Tree 树形控件的官方使用文档
2019/04/25 Javascript
详解关于表格合并span-method方法的补充(表格数据由后台动态返回)
2019/05/21 Javascript
vue 重塑数组之修改数组指定index的值操作
2020/08/09 Javascript
用C++封装MySQL的API的教程
2015/05/06 Python
总结Python中逻辑运算符的使用
2015/05/13 Python
Python实现模拟时钟代码推荐
2015/11/08 Python
Django中反向生成models.py的实例讲解
2018/05/30 Python
Python模块、包(Package)概念与用法分析
2019/05/31 Python
Python获取浏览器窗口句柄过程解析
2020/07/25 Python
浅析Python 字符编码与文件处理
2020/09/24 Python
HTML5 本地存储和内容按需加载的思路和方法
2011/04/07 HTML / CSS
移动端HTML5 input常见问题(小结)
2020/09/28 HTML / CSS
美国在线家装零售商:Build.com
2016/09/02 全球购物
女士时装鞋:Chinese Laundry
2018/08/29 全球购物
班主任师德师风自我剖析材料
2014/10/02 职场文书
宿舍卫生管理制度
2015/08/05 职场文书
2016年暑假学生家长评语
2015/12/01 职场文书
Spring Boot接口定义和全局异常统一处理
2022/04/20 Java/Android