bgiframe 在 ie9 下出问题

在IE9下juqery ui 里的dialog插件运行时候会有个遮盖层将原来页面全部遮盖，其实主要作用是为了遮住select。但是在IE9下运行不正常。用google搜索 “bgiframe IE9”关键词第一条就是jquery官方网站的bug版里的这个问题。看到作者已经修改了bgiframe的源代码，还没来得及研究原理。先粘上代码，有空研究。

现在网上流行的版本，也就是一直在用的：jquery.bgiframe-2.1.1.js

 
     1 
    /* 
     Copyright (c) 2006 Brandon Aaron (http://brandonaaron.net)
 
     2 
     * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) 
 
     3 
     * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
 
     4 
     *
 
     5 
     * $LastChangedDate: 2007-07-21 18:45:56 -0500 (Sat, 21 Jul 2007) $
 
     6 
     * $Rev: 2447 $
 
     7 
     *
 
     8 
     * Version 2.1.1
 
     9 
      
    */ 
    
 
    10 
    ( 
    function 
    ($){$.fn.bgIframe 
    = 
    $.fn.bgiframe 
    = 
    function 
    (s){ 
    if 
    ($.browser.msie 
    && 
    / 
    6.0 
    / 
    .test(navigator.userAgent)){s 
    = 
    $.extend({top: 
    ' 
    auto 
    ' 
    ,left: 
    ' 
    auto 
    ' 
    ,width: 
    ' 
    auto 
    ' 
    ,height: 
    ' 
    auto 
    ' 
    ,opacity: 
    true 
    ,src: 
    ' 
    javascript:false; 
    ' 
    },s 
    || 
    {}); 
    var 
     prop 
    = 
    function 
    (n){ 
    return 
     n 
    && 
    n.constructor 
    == 
    Number 
    ? 
    n 
    + 
    ' 
    px 
    ' 
    :n;},html 
    = 
    ' 
    <iframe class="bgiframe"frameborder="0"tabindex="-1"src=" 
    ' 
    + 
    s.src 
    + 
    ' 
    " 
    ' 
    + 
    ' 
    style="display:block;position:absolute;z-index:-1; 
    ' 
    + 
    (s.opacity 
    !== 
    false 
    ? 
    ' 
    filter:Alpha(Opacity=\'0\'); 
    ' 
    : 
    '' 
    ) 
    + 
    ' 
    top: 
    ' 
    + 
    (s.top 
    == 
    ' 
    auto 
    ' 
    ? 
    ' 
    expression(((parseInt(this.parentNode.currentStyle.borderTopWidth)||0)*-1)+\'px\') 
    ' 
    :prop(s.top)) 
    + 
    ' 
    ; 
    ' 
    + 
    ' 
    left: 
    ' 
    + 
    (s.left 
    == 
    ' 
    auto 
    ' 
    ? 
    ' 
    expression(((parseInt(this.parentNode.currentStyle.borderLeftWidth)||0)*-1)+\'px\') 
    ' 
    :prop(s.left)) 
    + 
    ' 
    ; 
    ' 
    + 
    ' 
    width: 
    ' 
    + 
    (s.width 
    == 
    ' 
    auto 
    ' 
    ? 
    ' 
    expression(this.parentNode.offsetWidth+\'px\') 
    ' 
    :prop(s.width)) 
    + 
    ' 
    ; 
    ' 
    + 
    ' 
    height: 
    ' 
    + 
    (s.height 
    == 
    ' 
    auto 
    ' 
    ? 
    ' 
    expression(this.parentNode.offsetHeight+\'px\') 
    ' 
    :prop(s.height)) 
    + 
    ' 
    ; 
    ' 
    + 
    ' 
    "/> 
    ' 
    ; 
    return 
      
    this 
    .each( 
    function 
    (){ 
    if 
    ($( 
    ' 
    > iframe.bgiframe 
    ' 
    , 
    this 
    ).length 
    == 
    0 
    ) 
    this 
    .insertBefore(document.createElement(html), 
    this 
    .firstChild);});} 
    return 
      
    this 
    ;};})(jQuery); 
   

作者修改后的版本：external/jquery.bgiframe-2.1.2.js

 
     1 
    /* 
    ! Copyright (c) 2010 Brandon Aaron (http://brandonaaron.net)
 
     2 
     * Licensed under the MIT License (LICENSE.txt).
 
     3 
     *
 
     4 
     * Version 2.1.2
 
     5 
      
    */ 
    
 
     6 
    
 
     7 
    ( 
    function 
    ($){
 
     8 
    
 
     9 
    $.fn.bgiframe  
    = 
     ($.browser.msie  
    && 
      
    / 
    msie 6\.0 
    / 
    i.test(navigator.userAgent)  
    ? 
      
    function 
    (s) {
 
    10 
     s  
    = 
     $.extend({
 
    11 
     top :  
    ' 
    auto 
    ' 
    ,  
    // 
     auto == .currentStyle.borderTopWidth 
    
 
    12 
     
     left :  
    ' 
    auto 
    ' 
    ,  
    // 
     auto == .currentStyle.borderLeftWidth 
    
 
    13 
     
     width :  
    ' 
    auto 
    ' 
    ,  
    // 
     auto == offsetWidth 
    
 
    14 
     
     height :  
    ' 
    auto 
    ' 
    ,  
    // 
     auto == offsetHeight 
    
 
    15 
     
     opacity :  
    true 
    ,
 
    16 
     src :  
    ' 
    javascript:false; 
    ' 
    
 
    17 
     }, s);
 
    18 
      
    var 
     html  
    = 
      
    ' 
    <iframe class="bgiframe"frameborder="0"tabindex="-1"src=" 
    ' 
    + 
    s.src 
    + 
    ' 
    " 
    ' 
    + 
    
 
    19 
      
    ' 
    style="display:block;position:absolute;z-index:-1; 
    ' 
    + 
    
 
    20 
     (s.opacity  
    !== 
      
    false 
    ? 
    ' 
    filter:Alpha(Opacity=\'0\'); 
    ' 
    : 
    '' 
    ) 
    + 
    
 
    21 
      
    ' 
    top: 
    ' 
    + 
    (s.top 
    == 
    ' 
    auto 
    ' 
    ? 
    ' 
    expression(((parseInt(this.parentNode.currentStyle.borderTopWidth)||0)*-1)+\'px\') 
    ' 
    :prop(s.top)) 
    + 
    ' 
    ; 
    ' 
    + 
    
 
    22 
      
    ' 
    left: 
    ' 
    + 
    (s.left 
    == 
    ' 
    auto 
    ' 
    ? 
    ' 
    expression(((parseInt(this.parentNode.currentStyle.borderLeftWidth)||0)*-1)+\'px\') 
    ' 
    :prop(s.left)) 
    + 
    ' 
    ; 
    ' 
    + 
    
 
    23 
      
    ' 
    width: 
    ' 
    + 
    (s.width 
    == 
    ' 
    auto 
    ' 
    ? 
    ' 
    expression(this.parentNode.offsetWidth+\'px\') 
    ' 
    :prop(s.width)) 
    + 
    ' 
    ; 
    ' 
    + 
    
 
    24 
      
    ' 
    height: 
    ' 
    + 
    (s.height 
    == 
    ' 
    auto 
    ' 
    ? 
    ' 
    expression(this.parentNode.offsetHeight+\'px\') 
    ' 
    :prop(s.height)) 
    + 
    ' 
    ; 
    ' 
    + 
    
 
    25 
      
    ' 
    "/> 
    ' 
    ;
 
    26 
      
    return 
      
    this 
    .each( 
    function 
    () {
 
    27 
      
    if 
     ( $( 
    this 
    ).children( 
    ' 
    iframe.bgiframe 
    ' 
    ).length  
    === 
      
    0 
     )
 
    28 
      
    this 
    .insertBefore( document.createElement(html),  
    this 
    .firstChild );
 
    29 
     });
 
    30 
    } :  
    function 
    () {  
    return 
      
    this 
    ; });
 
    31 
    
 
    32 
     
    // 
     old alias 
    
 
    33 
     
    $.fn.bgIframe  
    = 
     $.fn.bgiframe;
 
    34 
    
 
    35 
     
    function 
     prop(n) {
 
    36 
      
    return 
     n  
    && 
     n.constructor  
    === 
     Number  
    ? 
     n  
    + 
      
    ' 
    px 
    ' 
     : n;
 
    37 
    }
 
    38 
    
 
    39 
    })(jQuery);