Fancybox将样式表添加到父页面 [英] Fancybox add stylesheet to parent page
问题描述
我有这段代码可将样式表添加到fancybox iframe中的页面.我可以对父页面做同样的事情吗?
I have this code to add a stylesheet to a page in a fancybox iframe. Can I do the same to the parent page?
我已经尝试过了，但是没用...
I have tried this but it didn't work...
window.parent.changeStyles(stylesheet);
function changeStyles(styles){ $("，{ rel:样式表"， 输入:"text/css"， href:样式 }).appendTo("head"); };
function changeStyles(styles) { $("", { rel: "stylesheet", type: "text/css", href: styles }).appendTo("head"); };
$('.change-styles').on('click',function(){
var stylesheet = $(this).attr('href');
changeStyles(stylesheet);
return false
});
推荐答案
首先，定义一个父文件:
First, define a parent file:
<html>
<head></head>
<body>
<iframe src="iframe.html"></iframe>
</body>
</html>
然后将iframe文件作为iframe.html:
Then the iframe file as iframe.html:
<html>
<head>
<script>
function addCSSToParent(url) {
var link = document.createElement('link');
link.rel = 'stylesheet';
link.href = url;
link.type = 'text/css';
window.parent.document.getElementsByTagName('head')[0].appendChild(link);
}
// Add some CSS
addCSSToParent('some.css');
</script>
</head>
<body>This is the iframe.</body>
</html>
addCSSToParent()将使用给定的URL将新的DOM元素添加到其父项的头部.请确保在服务器环境中运行此程序，因为访问父级虽然可行，但在Chrome中却出现了一些安全性错误.
The addCSSToParent() will add a new DOM element into the head of its parent with the given URL. Make sure to run this in a server environment, because accessing the parent worked but gave a few security errors in Chrome.
这篇关于Fancybox将样式表添加到父页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
