Fancybox 3无法覆盖iframe的宽度和高度 [英] Fancybox 3 Cant override width and height of iframe
问题描述
我找到了很多fancybox2解决方案,但没有找到一个fancybox3解决方案. 所以第一件事
I found a lot of fancybox2 solutions but not a single fancybox 3 solution. So the first thing
我的iframe中有一个类似的HTML
I have a html like that in my iframe
<a data-fancybox class="fancyboxedit" data-src="facebook" href="javascript:;">
<input type='submit' value='Submit'>
</a>
$(".fancyboxedit").fancybox({
iframe : {
css : {
width : '600px'
height: '800px'
}
}
});
尽管文档中称它可以被覆盖,但我无法更改任何内容.但是我可以从源文件中更改它,这是可以的
Altough the documentation is calling it can be overwritten I cant change anything.Hovewer I can change from source file it is ok
推荐答案
我们的想法是鼓励您使用CSS设置iframe的宽度/高度-
The idea is that you are encouraged to set iframe width/height using CSS -
.fancybox-slide--iframe .fancybox-content { .. }
这使您可以轻松地将width/height与其他CSS属性(如min-width/max-width)结合起来,并使用媒体查询.默认的iframe尺寸也是使用CSS设置的.
This allows you to easily combine width/height with other CSS properties like min-width/max-width and use media queries. The default iframe dimensions are set using CSS, too.
除此之外,如果您需要使用JS覆盖CSS值,则可以这样做:
Besides this, if you need to overwrite CSS values using JS, you can do it like this:
$("[data-fancybox]").fancybox({
iframe : {
css : {
width : '800px',
height : '600px'
}
}
});
而且,正如Dat Nguyen所说,您的代码中有错别字-缺少逗号.
And, as Dat Nguyen already said, you have typo in your code - missing comma.
这篇关于Fancybox 3无法覆盖iframe的宽度和高度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!