jquery.boxy弹出框(后隔N秒后自动隐藏/自动跳转)


Posted in Javascript onJanuary 15, 2013

对于 Boxy弹出框的使用之前写过一些文章(查看jquery.boxy基础),今天主要是在解决一个需要之后,觉得值得把它记录下来,所以就再写一篇,主要功能是,在弹出对话框后,隔N秒后自动隐藏,还有就是自动跳转!

效果如图
jquery.boxy弹出框(后隔N秒后自动隐藏/自动跳转) 
而所封装的代码如下

// boxy对话框扩展 
var Boxy_Extensions = { 
options: { 
title: '艺吧提示', 
closeText: 'x' 
}, 
//弹出后N秒后隐藏 
alertDelayFun: function (info, timer, options) { 
options = $.extend(this.options, options || {}); 
new Boxy("<div style='padding-left:50px;padding-right:50px;text-align:center;font-size:14px;'>" + info + "</div>", $.extend({ behaviours: function () { 
setTimeout('$(".boxy-wrapper").hide();', timer); 
} 
}, options)); 
}, 
//弹出后,自动跳转 
alertHrefFun: function (info, href, options) { 
options = $.extend(this.options, options || {}); 
new Boxy("<div style='padding-left:50px;padding-right:50px;text-align:center;font-size:14px;'>" + info + "</div>", $.extend({ behaviours: function () { 
location.href = href; 
} 
}, options)); 
} 
}

因为options属性是公用的,所以把它提了出现,而每个方法有自己的options,如果在调用自己方法时传递了options,通过$.extend会把它

与类中options属性的内容进行合并(覆盖相关键的值,扩展新的键值),看来写JS也应该遵循面向对象的原则呀,呵呵!

Javascript 相关文章推荐
使用onbeforeunload属性后的副作用
Mar 08 Javascript
js报错 Object doesn't support this property or method的原因分析
Mar 31 Javascript
jquery struts 验证唯一标识(公用方法)
Mar 27 Javascript
Extjs4 Treegrid 使用心得分享(经验篇)
Jul 01 Javascript
HTML长文本截取含有HTML代码同样适用的两种方法
Jul 31 Javascript
提取字符串中年月日的函数代码
Nov 05 Javascript
jQuery获取动态生成的元素示例
Jun 15 Javascript
简易的JS计算器实现代码
Oct 18 Javascript
bootstrap轮播模板使用方法详解
Nov 17 Javascript
通过npm或yarn自动生成vue组件的方法示例
Feb 12 Javascript
vue改变对象或数组时的刷新机制的方法总结
Apr 24 Javascript
详解node登录接口之密码错误限制次数(含代码)
Oct 25 Javascript
SOSO地图API使用(一)在地图上画圆实现思路与代码
Jan 15 #Javascript
script的async属性以非阻塞的模式加载脚本
Jan 15 #Javascript
javascript真的不难-回顾一下基础知识
Jan 15 #Javascript
jQuery使用动态渲染表单功能完成ajax文件下载
Jan 15 #Javascript
jsvascript图像处理—(计算机视觉应用)图像金字塔
Jan 15 #Javascript
使用Post提交时须将空格转换成加号的解释
Jan 14 #Javascript
javascript函数以及基础写法100多条实用整理
Jan 13 #Javascript
You might like
php实现二进制和文本相互转换的方法
2015/04/18 PHP
浅析PHP数据导出知识点
2018/02/17 PHP
通过JAVASCRIPT读取ASP设定的COOKIE
2006/11/24 Javascript
ASP.NET jQuery 实例12 通过使用jQuery validation插件简单实现用户注册页面验证功能
2012/02/03 Javascript
二叉树的非递归后序遍历算法实例详解
2014/02/07 Javascript
javascript实例分享---具有立体效果的图片特效
2014/06/08 Javascript
jquery淡入淡出效果简单实例
2016/01/14 Javascript
浅谈Vue的基本应用
2016/12/27 Javascript
原生JS实现图片无缝滚动方法(附带封装的运动框架)
2017/10/01 Javascript
vue中如何动态绑定图片,vue中通过data返回图片路径的方法
2018/02/07 Javascript
jquery 动态遍历select 赋值的实例
2018/09/12 jQuery
微信小程序webview 脚手架使用详解
2019/07/22 Javascript
JavaScript 继承 封装 多态实现及原理详解
2019/07/29 Javascript
解决vue单页面修改样式无法覆盖问题
2019/08/05 Javascript
记一次react前端项目打包优化的方法
2020/03/30 Javascript
OpenLayers3实现地图显示功能
2020/09/25 Javascript
[01:11]steam端dota2实名认证操作流程视频
2021/03/11 DOTA
Python批量修改文件后缀的方法
2014/01/26 Python
用Python实现换行符转换的脚本的教程
2015/04/16 Python
Python函数可变参数定义及其参数传递方式实例详解
2015/05/25 Python
Python3.4编程实现简单抓取爬虫功能示例
2017/09/14 Python
python数据批量写入ScrolledText的优化方法
2018/10/11 Python
python中报错&quot;json.decoder.JSONDecodeError: Expecting value:&quot;的解决
2019/04/29 Python
Python使用到第三方库PyMuPDF图片与pdf相互转换
2019/05/03 Python
Python中Subprocess的不同函数解析
2019/12/10 Python
AUC计算方法与Python实现代码
2020/02/28 Python
CSS3实现背景透明文字不透明的示例代码
2018/06/25 HTML / CSS
Ralph Lauren拉夫·劳伦美国官网:带有浓郁美国气息的高品味时装品牌
2017/11/01 全球购物
加拿大在线旅游公司:Flighthub
2019/03/11 全球购物
C语言编程题
2015/03/09 面试题
少先队学雷锋活动总结范文
2014/03/09 职场文书
研究生求职自荐书
2014/06/23 职场文书
航海技术专业毕业生推荐信
2014/07/09 职场文书
2016年秋季开学典礼新闻稿
2015/11/25 职场文书
代码复现python目标检测yolo3详解预测
2022/05/06 Python
springboot 全局异常处理和统一响应对象的处理方式
2022/06/28 Java/Android