Jquery problems with adding css to iframe content

Question

I have found multiple posts on how to add css to iframe content and this is my code:

$(function() {
    $('iframe').addClass('bro'); //does work
    $('iframe').contents().find('html').addClass('broz'); //doesn't work
    $('iframe').contents().find('.side-section').addClass('brozzz'); //doesn't work
});

The first one works, as expected, but then all the other identifiers don't work. I am just trying to test out why they aren't working, this isn't the actual work I'm doing.

This is the iframe code:

<iframe src="http://www.dropcards.com/download/profilewidget/?ArtistID=17121" width="400" height="230" scrolling="no" frameborder="0" allowtransparency="true" ></iframe>

using latest jquery if that matters

chasethesunnn
– chasethesunnn

2012-07-14 22:03:37 +00:00
Commented Jul 14, 2012 at 22:03 — chasethesunnn
– chasethesunnn, Commented Jul 14, 2012 at 22:03

Community · Accepted Answer · 2017-05-23 10:34:29Z

4

You cannot modify the dom of the page in an iframe, if the page is not from the same domain as the domain containing the iframe. The idea is to to prevent XSS, cross-side-scripting.

You can find more info heresame origin policy

In the first case, you are modifying your page's dom, in the next 2 cases, this is not possible since, you do not have access to the dom of the page contained in the iframe

edited May 23, 2017 at 10:34

CommunityBot

11 silver badge

answered Jul 14, 2012 at 22:07

sanz

1,0691 gold badge10 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

chasethesunnn Over a year ago

ok thanks for the info! It is interesting that all the questions about how to do this never mention if it is from the same domain or not, but I do see why this feature is there: stackoverflow.com/questions/3714880/…

Ram · Accepted Answer · 2012-07-14 22:08:38Z

1

if the the contents of the iframe are from another domain you are not allowed to manipulate them.

answered Jul 14, 2012 at 22:08

Ram

145k16 gold badges174 silver badges201 bronze badges

Collectives™ on Stack Overflow

Jquery problems with adding css to iframe content

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related