Change background color of iframe issue

Question

I need to change background color to white of the displayed page if <iframe></iframe>. Is that possible? Now background of the original website is gray.

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

I want to change the background of loaded page

Answer 1

Put the Iframe between aside tags

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

Answer 2

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

Answer 3

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 :)

Answer 4

I frame background can be changed. like below

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

and if you want to change the background of page what you have loaded in iframe then i think it not possible.