jquery.boxy彈出框(后隔N秒后自動(dòng)隱藏/自動(dòng)跳轉(zhuǎn))
更新時(shí)間：2013年01月15日 15:46:19 作者：
對于 Boxy彈出框的使用之前寫過一些文章（查看jquery.boxy基礎(chǔ)），今天主要是在解決一個(gè)需要之后，覺得值得把它記錄下來，所以就再寫一篇，主要功能是，在彈出對話框后，隔N秒后自動(dòng)隱藏，還有就是自動(dòng)跳轉(zhuǎn)
對于 Boxy彈出框的使用之前寫過一些文章（查看jquery.boxy基礎(chǔ)），今天主要是在解決一個(gè)需要之后，覺得值得把它記錄下來，所以就再寫一篇，主要功能是，在彈出對話框后，隔N秒后自動(dòng)隱藏，還有就是自動(dòng)跳轉(zhuǎn)！
效果如圖：
而所封裝的代碼如下：
// boxy對話框擴(kuò)展
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));
},
//彈出后，自動(dòng)跳轉(zhuǎn)
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));
}
}
因?yàn)閛ptions屬性是公用的，所以把它提了出現(xiàn)，而每個(gè)方法有自己的options，如果在調(diào)用自己方法時(shí)傳遞了options，通過$.extend會(huì)把它
與類中options屬性的內(nèi)容進(jìn)行合并（覆蓋相關(guān)鍵的值，擴(kuò)展新的鍵值），看來寫JS也應(yīng)該遵循面向?qū)ο蟮脑瓌t呀，呵呵！
效果如圖：
而所封裝的代碼如下：
復(fù)制代碼 代碼如下:
// boxy對話框擴(kuò)展
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));
},
//彈出后，自動(dòng)跳轉(zhuǎn)
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));
}
}
因?yàn)閛ptions屬性是公用的，所以把它提了出現(xiàn)，而每個(gè)方法有自己的options，如果在調(diào)用自己方法時(shí)傳遞了options，通過$.extend會(huì)把它
與類中options屬性的內(nèi)容進(jìn)行合并（覆蓋相關(guān)鍵的值，擴(kuò)展新的鍵值），看來寫JS也應(yīng)該遵循面向?qū)ο蟮脑瓌t呀，呵呵！
相關(guān)文章
jquery實(shí)現(xiàn)marquee效果(文字或者圖片的水平垂直滾動(dòng))
原本在前端html代碼中，實(shí)現(xiàn)文字或者圖片的水平垂直滾動(dòng)，都是使用的marquee，但隨著考慮瀏覽器的兼容性和符合為w3c的標(biāo)準(zhǔn)，接下來介紹使用Jquery實(shí)現(xiàn)網(wǎng)頁marquee效果,感興趣的朋友可以了解下哦2013-01-01
hover的用法及l(fā)ive的用法介紹(鼠標(biāo)懸停效果)
hover屬性在書寫css時(shí)大家都不會(huì)陌生了吧live主要用于對動(dòng)態(tài)加載出來的元素綁定事件，下來將為大家詳細(xì)介紹下兩者的使用，感興趣的朋友可不要錯(cuò)過了哈2013-03-03
本文詳細(xì)講解了Jquery使用AJAX方法請求數(shù)據(jù)，文中通過示例代碼介紹的非常詳細(xì)。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-05-05
jQuery動(dòng)態(tài)添加元素?zé)o法觸發(fā)綁定事件的解決方法分析
這篇文章主要介紹了jQuery動(dòng)態(tài)添加元素?zé)o法觸發(fā)綁定事件的解決方法,結(jié)合實(shí)例形式分析了動(dòng)態(tài)添加元素?zé)o法綁定事件的原因與相關(guān)解決方法,需要的朋友可以參考下2018-01-01
jquery EasyUI的formatter格式化函數(shù)代碼
以下實(shí)例格式化數(shù)據(jù)表格中的一列。如果金額小于20時(shí)使用自定義的格式器將文本變成紅色。2011-01-01
這篇文章主要介紹了JQuery中的常用事件、對象屬性與使用方法,結(jié)合實(shí)例形式分析了jquery事件、對象屬性、方法相關(guān)使用技巧,需要的朋友可以參考下2019-12-12
這篇文章主要介紹了jquery對table做排序操作的實(shí)例演示,通過添加自定義屬性data-sort-field-ftime及表頭添加onchange事件詳細(xì)講解了操作過程,需要的朋友可以參考下2017-08-08
獲取元素值的方法有很多，在本文將為大家詳細(xì)介紹下使用jquery是如何做到的，感興趣的朋友不要錯(cuò)過2013-11-11
這篇文章主要為大家詳細(xì)介紹了JQuery實(shí)現(xiàn)頁面彈出框，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-02-02
checkbox想必大家對這個(gè)控件并不陌生吧，畢竟在網(wǎng)頁制作過程中經(jīng)常會(huì)使用到，下面與大家分享個(gè)示例主要介紹checkbox的使用，感興趣的朋友可以參考下2013-08-08