代码之家 › 专栏 › 技术社区 › Stephen Way

跨浏览器HTML5 iFrame

cross-browser html5 dom jquery

Stephen Way · 技术社区 · 16 年前

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.google.com%2F&amp;layout=standard&amp;show_faces=false&amp;width=400&amp;action=like&amp;colorscheme=light&amp;height=35" seamless></iframe>

有几个css属性

iframe {
  overflow: hidden !important;
  border: none !important;
  width: 400px;
  height: 35px;
  background-color: #cce0da;
  text-align: right;
  padding-left: 20px;
}

对于internetexplorer,我将一些回退属性应用于jQuery

$(function() {
  $('iframe', '.ie')
    .attr('allowTransparency', 'true')
    .attr('frameBorder', '0')
    .attr('scrolling', 'no');
});

我最终得到的是IE中一个透明的iFrame,带有不必要的边框。

也许我的代码有问题?也许我对frameBorder属性的DOM操作在准备好了吗?

3 回复 | 直到 16 年前

Josh Stodola 16 年前

尝试直接在标记中添加“frameborder”属性。。。

<iframe frameborder="0"

user806048 user806048 15 年前

<!--[if lt IE 9]>
 <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> 
 <script src="myscrip"></script>
<![endif]-->

这是我的剧本

jQuery("iframe").each(function() {

  var copy = jQuery(this).clone();

  jQuery(copy).attr("frameborder", '0');
  jQuery(copy).attr("scrolling", 'no');

  jQuery(copy).replaceAll(this);

});

是首选的添加脚本

jQuery(document).ready(function ()

 iframe css=display:none
 add in my script function .show after replaceAll

Jake Johnson 15 年前

如果您希望您的文档在HTML5中进行验证,可以使用原始方法。要使其在IE<9中正常工作,您需要做以下几件事:

1) 克隆iframe,设置属性,然后附加到容器。或者从头开始创建iframe元素。就是不让你事后设置属性。

    $('#facebook-like iframe').clone().attr({ 'frameBorder': '0', 'allowTransparency': 'true', 'scrolling': 'no' }).appendTo('#facebook-like');
    $('#facebook-like iframe').first().remove();

推荐文章

Robo Robok · 为什么我无法使用Dom\HTMLDocument搜索标签?

1 年前

Y-jiji · 调整大小时替换了假选择

1 年前

LLScheme · 无法使用Playwright&Pyppeteer找到关键字

1 年前

Konrad Viltersten · 无法修改ViewContainerRef的内部内容,只能在Angular中添加标签

1 年前

Eric G · 如何将svg文本元素垂直居中?

2 年前

Nail Val · 当条件通过时,If语句不显示console.log,并按意外情况继续工作

2 年前

Juan Lanus · 如何获取对所选内容的DOM元素的引用

2 年前

huz3y · addEventListener不适用于从javascript添加的新类所选的元素

2 年前

Toby Hogan · 元素React状态更改后未在DOM中更新

2 年前

user23745914 · 能够访问javascript中的dom元素,而无需显式定义查询选择器

2 年前