Thursday, 22 August 2013

IE10 does not support css link in iframe

IE10 does not support css link in iframe

I have iframe, which loaded dynamically. Content in this iframe should be
styled like page on which it's located. To do this I added link to css
file to iframe head. It works OK in Firefox, but it doesn't work in IE10.
Is it known issue?
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#dialogIframe').load(function(){
$('#dialogIframe')
.contents().find("body")
.html("test iframe");
$('#dialogIframe')
.contents().find("head")
.html('<link rel="stylesheet" type="text/css"
href="/css/main.css">');
});
});
</script>
</head>
<body>
Test
<iframe id="dialogIframe" style="width:300px; height:300px; border: none;">
</iframe>
</body>
</html>
http://jsfiddle.net/YwCRf/

No comments:

Post a Comment