13

我需要将背景颜色更改为显示页面的白色<iframe></iframe>。那可能吗？现在原网站的背景是灰色的。

 <iframe allowtransparency="true" style="background-color: Snow;" src="http://zingaya.com/widget/9d043c064dc241068881f045f9d8c151" frameborder="0" height="184" width="100%">
    </iframe>

我想改变加载页面的背景

4

6 回答 6

37

背景可以<iframe>这样改变：

<iframe allowtransparency="true" style="background: #FFFFFF;" 
    src="http://zingaya.com/widget/9d043c064dc241068881f045f9d8c151" 
    frameborder="0" height="184" width="100%">
</iframe>

我认为不可能更改您在 iframe中加载的页面的背景。

于 2013-02-12T10:59:04.367 回答
3

JavaScript 是您所需要的。如果您在加载页面时加载 iframe，请使用 onload 事件插入 iframe 测试。如果 iframe 是实时插入的，则在插入时创建一个回调函数并挂钩您需要采取的任何操作:)

于 2013-02-12T14:07:02.487 回答
2

你可以使用 javascript

  • 更改 iframe 背景颜色
  • 更改加载页面的背景颜色（同域）

纯javascript

var iframe = document.getElementsByTagName('iframe')[0];
iframe.style.background = 'white';
iframe.contentWindow.document.body.style.backgroundColor = 'white';

jQuery

$('iframe').css('background', 'white');
$('iframe').contents().find('body').css('backgroundColor', 'white');
于 2018-05-27T05:09:55.110 回答
2

只是基于 Chetabahana 所写的内容，我发现在 JS 函数中添加短暂的延迟对我正在开发的网站有所帮助。这意味着该函数在 iframe 加载后启动。你可以玩弄延迟。

var delayInMilliseconds = 500; // half a second

setTimeout(function() { 

   var iframe = document.getElementsByTagName('iframe')[0];
   iframe.style.background = 'white';
   iframe.contentWindow.document.body.style.backgroundColor = 'white';

}, delayInMilliseconds);

我希望这有帮助！

于 2019-04-24T14:33:51.970 回答
0

有可能的。使用 vanilla Javascript，您可以使用下面的函数作为参考。

function updateIframeBackground(iframeId) {
    var x = document.getElementById(iframeId);
    var y = (x.contentWindow || x.contentDocument);
    if (y.document) y = y.document;
    y.body.style.backgroundColor = "#2D2D2D";
}

https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_iframe_contentdocument

于 2020-08-18T15:43:30.990 回答
-3

将 iframe 放在旁边的标签之间

<aside style="background-color:#FFF"> your IFRAME </aside>

于 2016-02-10T09:41:01.950 回答