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 相关文章推荐
div浮层,滚动条移动,位置保持不变的4种方法汇总
Dec 11 Javascript
Jquery原生态实现表格header头随滚动条滚动而滚动
Mar 18 Javascript
javascript 10进制和62进制的相互转换
Jul 31 Javascript
网页收藏夹显示ICO图标(代码少)
Aug 04 Javascript
XMLHttpRequest对象_Ajax异步请求重点(推荐)
Sep 28 Javascript
关于vuejs中v-if和v-show的区别及v-show不起作用问题
Mar 26 Javascript
vue中使用sessionStorage记住密码功能
Jul 24 Javascript
JavaScript中this用法学习笔记
Mar 17 Javascript
JavaScript实现美化滑块效果
May 17 Javascript
layer.open的自适应及居中及子页面标题的修改方法
Sep 05 Javascript
Js图片点击切换轮播实现代码
Jul 27 Javascript
vuecli项目构建SSR服务端渲染的实现
Oct 30 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新手上路(三)
2006/10/09 PHP
php基础知识:类与对象(1)
2006/12/13 PHP
php设计模式 Adapter(适配器模式)
2011/06/26 PHP
php中mysql连接和基本操作代码(快速测试使用,简单方便)
2014/04/25 PHP
php的闭包(Closure)匿名函数详解
2015/02/22 PHP
php生成毫秒时间戳的实例讲解
2017/09/22 PHP
PHP实现的一致性Hash算法详解【分布式算法】
2018/03/31 PHP
Laravel 5.2 文档 数据库 ―― 起步介绍
2019/10/21 PHP
使用dynatrace-ajax跟踪JavaScript的性能
2010/04/12 Javascript
为超链接加上disabled后的故事
2010/12/10 Javascript
JS特殊函数(Function()构造函数、函数直接量)区别介绍
2013/05/19 Javascript
收集json解析的四种方法分享
2014/01/17 Javascript
javascript中sort排序实例详解
2016/07/24 Javascript
React中ES5与ES6写法的区别总结
2017/04/21 Javascript
基于Vue2的独立构建与运行时构建的差别(详解)
2017/12/06 Javascript
vue.js的简单自动求和计算实例
2019/11/08 Javascript
浅谈Python基础之I/O模型
2017/05/11 Python
Python利用matplotlib绘制约数个数统计图示例
2019/11/26 Python
python3光学字符识别模块tesserocr与pytesseract的使用详解
2020/02/26 Python
pycharm激活码快速激活及使用步骤
2020/03/12 Python
Python的PIL库中getpixel方法的使用
2020/04/09 Python
Python configparser模块应用过程解析
2020/08/14 Python
微信小程序之html5 canvas绘图并保存到系统相册
2019/06/20 HTML / CSS
GUESS德国官网:美国牛仔服装品牌
2017/02/14 全球购物
End Clothing美国站:英国男士潮牌商城
2018/04/20 全球购物
儿科护士自我鉴定
2013/10/14 职场文书
教师开学感言
2014/02/14 职场文书
中餐厅经理岗位职责
2014/04/11 职场文书
论文评语大全
2014/04/29 职场文书
党的群众路线教育实践活动整改方案
2014/10/28 职场文书
2014保险公司个人工作总结
2014/12/09 职场文书
2015年扫黄打非工作总结
2015/05/13 职场文书
2015中学教师个人工作总结
2015/07/22 职场文书
2015年除四害工作总结
2015/07/23 职场文书
详解Mysql 函数调用优化
2021/04/07 MySQL
苹果发布了MagSafe固件更新,可以不外接电源实现最高7.5W充电
2022/04/21 数码科技