最近站长Tony开发了一个jquery.pop.js插件，这是一个用来处理弹出框的jQuery插件，目的是为了兼容IE6浏览器，从此不用不用为了IE6写CSS hack了，现代浏览器的fix和absolute怎么写就怎么写，无需考虑IE6一样兼容。值得注意的是jquery版本要求是1.3到1.8，HTML声明请遵循W3C标准。

使用方法：

$('#loginBox').popup(); $('#loginBox').pophide();

以上是弹出框的弹出和隐藏。

$('#loginBox').popup({ filter : '#filter' }); $('#loginBox').pophide({ filter : '#filter' });

如果添加了参数filter，表示弹出的同时开启滤镜，关闭的时候关闭滤镜。filter传入的值和你想要填写的选择器的内容是一样的。

demo地址：

jquery.pop.js插件的代码如下：

//@charset "utf-8"; /** * jquery版本要求：1.3 ~ 1.8，HTML声明请遵循W3C标准 * 用来处理弹出框的jQuery插件 * 兼容IE6浏览器，从此您再也不用担心IE6的弹框 * 不用写css hack，否则会出问题，现代浏览器怎么写就怎么写 * @author wangzhiangtony@qq.com * @version 1.2 * @date 2013-3-27 10:09:59 */ (function($) { //弹出的窗口处于屏幕中间 $.fn.popup = function(opts) { var defaults = { filter : '' }; var options = $.extend(defaults, opts); if(defaults.filter != '') { var maskHeight = $('body').height(); $(options.filter).css('height', maskHeight); $(options.filter).show(); } var str = $(this); var pos = str.css('position'); if(pos == 'fixed') { var top = ($(window).height() - str.height()) / 2; //fix兼容ie6 if($.browser.msie && $.browser.version == "6.0") { str.css('position', 'absolute'); var dom = str[0]; $('body').css({ 'background-image' : 'url(about:blank)', 'background-attachment' : 'fixed' }); dom.style.setExpression('top', 'eval((document.documentElement.scrollTop)+' + top + ')'); } } else { var top = $(window).scrollTop() + ($(window).height() - str.height()) / 2; } if(top > 0) { str.css('top', top); } else { str.css('top', 0); } var width = $(window).width(); var left = (width - str.width()) / 2; if(left > 0) { str.css('left', left); } else { str.css('left', 0); } str.css('z-index', '1000'); str.show(); }; $.fn.pophide = function(opts) { var defaults = { filter : '' }; var options = $.extend(defaults, opts); if(defaults.filter != '') { $(options.filter).hide(); } $(this).hide(); }; })(jQuery);

demo下载地址：jquery.pop.js (457)

 

Tonitech版权所有 | 转载请注明出处：