Change background color of iframe issue

Question

I need to change background color to white of the displayed page if  lt iframe gt  lt  iframe gt   Is that possible  Now background of the original website is gray      lt iframe allowtransparency  true  style  background-color  Snow   src  http   zingaya com widget 9d043c064dc241068881f045f9d8c151  frameborder  0  height  184  width  100   gt       lt  iframe gt    I want to change the background of loaded page

User · Answer

You can do it using javascript

Change iframe background color
Change background color of the loaded page (same domain)

Plain 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');

User · Answer

JavaScript is what you need  If you are loading iframe when loading the page  insert the test for iframe using the onload event  If iframe is inserted in realtime  then create a callback function on insertion and hook in whatever action you need to take

User · Answer

Put the Iframe between aside tags    lt aside style  background-color  FFF  gt   your IFRAME   lt  aside gt

User · Answer

It is possible  With vanilla Javascript  you can use the function below for reference  function updateIframeBackground iframeId        var x   document getElementById iframeId       var y    x contentWindow    x contentDocument       if  y document  y   y document      y body style backgroundColor    quot  2D2D2D quot      https   www w3schools com jsref tryit asp filename tryjsref iframe contentdocument

User · Answer

An  lt iframe gt  background can be changed like this    lt iframe allowtransparency  true  style  background   FFFFFF        src  http   zingaya com widget 9d043c064dc241068881f045f9d8c151       frameborder  0  height  184  width  100   gt   lt  iframe gt    I don t think it s possible to change the background of the page that you have loaded in the iframe

User · Answer

just building on what Chetabahana wrote  I found that adding a short delay to the JS function helped on a site I was working on  It meant that the function kicked in after the iframe loaded  You can play around with the delay   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     I hope this helps

[html] Change background color of iframe issue

Examples related to html

Examples related to iframe

Examples related to background-color