Skip to main content

Use jQuery to Change CSS on iFrame Content

By Sam Deering



Free JavaScript Book!

Write powerful, clean and maintainable JavaScript.

RRP $11.95

In this post, I have also included some documentation of failed attempts on trying to change the CSS of iframed content on a different domain. Also some information on how to change css in an iframe on same domain, which (as far as I know) can’t be done without a proxy pass or such.

Cross domain Efforts

How it works:

Compared URL Outcome Reason Success Same protocol and host Success Same protocol and host Failure Same protocol and host but different port Failure Different protocol Failure Different host Failure Different host (exact match required) Failure Different host (exact match required)

Insert iFrame:

Ways to to change CSS in an iframe

Some of these work, and some don’t but i’ve included both for you to ponder amd make up your own decisions.

This method didn’t work for me.

var text = 'hi';
var content = "" + text + "";

var iframe = document.createElement("iframe");
iframe.src = '' +
          'body{margin:0;padding:0;background:transparent}' +

Further thoughts


frameReady: Remote function calling for jQuery – jquery.frameready.js

Cross Domain Setups that may work

These setups should work and avoid the cross domain issues.

Site 1 – or
Site 2 –

All you need to do is to add this line of JavaScript to both site A and B:

document.domain = ''

Site 1 – or
Site 2 –

To make this work, you need to create a sub domain called e.g. Then point the new sub domain to the IP address of Now both site A and B is located under and you can start to implement solution 1.

Iframe Proxying and hacks

Good article on how to include nested iframes to display content – Read article.
Good article on secure cross domain iframe communication – Read article.

Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.

New books out now!

Learn valuable skills with a practical introduction to Python programming!

Give yourself more options and write higher quality CSS with CSS Optimization Basics.