Why don't iframes in different div element work?

Question

Fiddle

Why is it that only one of the iframes will work at the same time? Is something wrong with my javascript?

function test(){
    document.getElementById('src1').src='http://cnn.com/'
}
function test1(){
    document.getElementById('src2').src='http://stackoverflow.com/'
}


test();
test1();

The problem is not with the iframe itself, but with the link that the second iframe is trying to load. When using iFrames there are some security issues you must be aware. — guanabara, Jul 08 '13 at 07:28

score 1 · Accepted Answer · edited May 23 '17 at 11:49

1

It does work, it's just stackoverflow which is preventing you to embed it's URL in an iframe for security reasons ...

You may see, even Google prevents an user to embed the google URL to be used in an iframe

function test1(){ //Alter the URL in this function
    document.getElementById('src2').src='https://stackoverflow.com/'
}

Demo

Prevent iframe stealing

edited May 23 '17 at 11:49

Community

1
1

answered Jul 08 '13 at 07:24

Mr. Alien

153,751
34
298
278

I am trying to this with Youtube and CNN. Without CNN, the youtube video comes into the iframe perfectly but with CNN, the youtube iframe appears blank. Is there any way around this? – idude Jul 08 '13 at 07:28

score 1 · Answer 2 · answered Jul 08 '13 at 07:27

1

It's not because there are two iframes it's because stackoverflow has a special header:

X-Frame-Options set to SAMEORIGIN

that header prevents the browser to render the page inside an iframe

Why don't iframes in different div element work?

2 Answers2