阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      插件 jQuery.bgiframe 中文API文档

      插件 jQuery.bgiframe 中文API文档

      源码 & 下载

      一个jQuery插件,有助于减轻处理IE z索引问题时的痛苦。

      bgiframe

      已重写插件以删除CSS表达式的使用并仅限制IE6的限制。默认情况下IE6限制已启用,但现在可通过传递conditional选项进行配置。例如,如果您尝试在以后的IE版本中在Silverlight上进行分层,则可能需要执行此操作。删除CSS表达式后,您现在需要在更改后更改宽度,高度和/或边框的元素上重新运行bgiframe。

      bgiframe插件是可链接的,并应用iframe hack来解决zIndex问题。它只会在IE6中应用(默认情况下),并在iframe中添加一个名为’bgiframe’的类。iframe作为匹配元素的第一个子项附加,其tabIndex和zIndex为-1。

      默认情况下,插件会将带有像素单位大小的边框考虑在内。如果使用不同的单位作为边框宽度,则需要使用顶部和左侧设置,如下所述。

      我该如何使用它?

      用法很简单。只需在jQuery元素集合上调用bgiframe即可。

      $('.fix-z-index').bgiframe();
      

      如果您的元素更改宽度,高度或边框宽度,则需要在更改后对这些元素调用bgiframe。

      以下是使用不同条件和调用bgiframe操作元素的示例。

      var settings = { conditional: /MSIE/.test(navigator.userAgent) },
          $testing = $('#testing');
      $testing
          .bgiframe(settings)
          .bind('click', function(e) {
              $testing
                  .width( $testing.width() + 10 )
                  .height( $testing.height() + 10 )
                  .bgiframe(settings);
          });
      

      设置

      该插件尽力处理大多数情况,但有时需要进行一些配置。以下是可用设置的列表。

      • top (字符串|数字):iframe必须通过顶部边框的宽度向顶部偏移。这应该是表示border-top-width的负数。如果在此处使用数字,则将假设像素。否则,请务必指定一个单位。也可以使用表达式。默认情况下,该值为“auto”,它将使用由jQuery计算的元素border top width。
      • left (字符串|数字):iframe必须向左偏移左边框的宽度。这应该是表示border-left-width的负数。如果此处使用数字,则将假定像素。否则,请务必指定一个单位。也可以使用表达式。默认情况下,该值为“auto”,它将使用由jQuery计算的元素边框左边宽度。
      • width (字符串|数字):这是iframe的宽度。如果在此处使用数字,则将采用像素。否则,请务必指定一个单位。也可以使用表达式。默认情况下,值为“auto”,它将是元素的offsetWidth。
      • height (字符串|数字):这是iframe的高度。如果在此处使用数字,则将采用像素。否则,请务必指定一个单位。也可以使用表达式。默认情况下,该值为“auto”,它将使用元素的offsetHeight。
      • opacity (布尔值):这是一个表示是否使用不透明度的布尔值。如果设置为true,则应用不透明度0。如果设置为false,则不应用不透明度过滤器。默认值:true。
      • src (字符串):提供此设置,以便可以将iframe的src更改为他们需要的任何内容。默认值:“javascript:false;”
      • conditional (布尔|函数):打开或关闭iFrame的注入。true打开iFrame并将false其关闭。默认是IE6只有条件。
      目录
      目录