天天看點

Js~對Boxy彈出框進行封裝,提供彈出後自動隐藏與自動跳轉功能

對于 Boxy彈出框的使用之前寫過一些文章(檢視jquery.boxy基礎),今天主要是在解決一個需要之後,覺得值得把它記錄下來,是以就再寫一篇,主要功能是,在彈出對話框後,隔N秒後自動隐藏,還有就是自動跳轉!

效果如圖:

Js~對Boxy彈出框進行封裝,提供彈出後自動隐藏與自動跳轉功能

而所封裝的代碼如下:

1 // boxy對話框擴充
 2 var Boxy_Extensions = {
 3     options: {
 4         title: '藝吧提示',
 5         closeText: 'x'
 6     },
 7     //彈出後N秒後隐藏
 8     alertDelayFun: function (info, timer, options) {
 9         options = $.extend(this.options, options || {});
10         new Boxy("<div style='padding-left:50px;padding-right:50px;text-align:center;font-size:14px;'>" + info + "</div>", $.extend({ behaviours: function () {
11             setTimeout('$(".boxy-wrapper").hide();', timer);
12         }
13         }, options));
14     },
15     //彈出後,自動跳轉
16     alertHrefFun: function (info, href, options) {
17         options = $.extend(this.options, options || {});
18         new Boxy("<div style='padding-left:50px;padding-right:50px;text-align:center;font-size:14px;'>" + info + "</div>", $.extend({ behaviours: function () {
19             location.href = href;
20         }
21         }, options));
22     }
23      

繼續閱讀