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 相关文章推荐
javascript 当前日期加(天、周、月、年)
Aug 09 Javascript
JavaScript编程开发中的五个实用小技巧
Jul 22 Javascript
探讨JQUERY JSON的反序列化类 using问题的解决方法
Dec 19 Javascript
jQuery中ajax的post()方法用法实例
Dec 26 Javascript
JS+CSS实现仿雅虎另类滑动门切换效果
Oct 13 Javascript
常用Javascript函数与原型功能收藏(必看篇)
Oct 09 Javascript
Vue仿今日头条实例详解
Feb 06 Javascript
Moment.js实现多个同时倒计时
Aug 26 Javascript
javascript网页随机点名实现过程解析
Oct 15 Javascript
vue 动态表单开发方法案例详解
Dec 02 Javascript
如何利用Node.js与JSON搭建简单的动态服务器
Jun 16 Javascript
vue 导航锚点_点击平滑滚动,导航栏对应变化详解
Aug 10 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 setcookie指定domain参数后,在IE下设置cookie失效的解决方法
2011/09/09 PHP
解决file_get_contents无法请求https连接的方法
2013/12/17 PHP
PHP共享内存使用与信号控制实例分析
2018/05/09 PHP
Yii框架中用response保存cookie,用request读取cookie的原理解析
2019/09/04 PHP
Laravel 微信小程序后端搭建步骤详解
2019/11/26 PHP
多次注册事件会导致一个事件被触发多次的解决方法
2013/08/12 Javascript
jQuery的each终止或跳过示例代码
2013/12/12 Javascript
Javascript 完美运动框架(逐行分析代码,让你轻松了运动的原理)
2015/01/23 Javascript
浅谈js中变量初始化
2015/02/03 Javascript
jQuery实现带幻灯的tab滑动切换风格菜单代码
2015/08/27 Javascript
jquery判断复选框是否被选中的方法
2015/10/16 Javascript
Jquery轮播效果实现过程解析
2016/03/30 Javascript
微信小程序商城项目之购物数量加减(3)
2017/04/17 Javascript
Nuxt.js开启SSR渲染的教程详解
2018/11/30 Javascript
JQuery通过键盘控制键盘按下与松开触发事件
2020/08/07 jQuery
解决vue数据不实时更新的问题(数据更改了,但数据不实时更新)
2020/10/27 Javascript
[41:08]TNC vs VG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
[01:09:01]完美世界DOTA2联赛循环赛 Magma vs PXG BO2第一场 10.28
2020/10/28 DOTA
python获取当前时间对应unix时间戳的方法
2015/05/15 Python
Django项目中包含多个应用时对url的配置方法
2018/05/30 Python
PHP实现发送和接收JSON请求
2018/06/07 Python
python七夕浪漫表白源码
2019/04/05 Python
python中利用numpy.array()实现俩个数值列表的对应相加方法
2019/08/26 Python
Python hashlib模块实例使用详解
2019/12/24 Python
零基础学python应该从哪里入手
2020/08/11 Python
Pandas中DataFrame交换列顺序的方法实现
2020/12/14 Python
香港零食网购:上仓胃子
2020/06/08 全球购物
JAVA中的关键字有什么特点
2014/03/07 面试题
写自荐信要注意什么
2013/12/26 职场文书
2014年九一八事变演讲稿
2014/09/14 职场文书
家庭困难证明
2014/10/12 职场文书
党性分析自查总结
2014/10/14 职场文书
死者家属慰问信
2015/03/24 职场文书
详解MySQL的半同步
2021/04/22 MySQL
教你怎么用python实现字符串转日期
2021/05/24 Python
Win10 Anaconda安装python-pcl
2022/04/29 Servers