jQuery 使用fancybox设置高度和宽度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11306587/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
using fancybox set height and width
提问by user1498036
i am new to j query, it is cool, but i am glued to the ceiling on how to add width and height to a iframe generated after click, using this code: all suggestions would be great and thanks in advance Khadija
我是 j 查询的新手，这很酷，但我对如何将宽度和高度添加到点击后生成的 iframe 使用此代码的天花板很感兴趣：所有建议都会很棒，提前感谢 Khadija
$(document).ready(function () {
$(".fancybox").fancybox();
})
.height = '600px';
回答by timactive
You must set autoSizeto false
您必须将autoSize设置为 false
$(".fancybox").fancybox({'width':400,
'height':300,
'autoSize' : false});
回答by Zuul
To initialize the fancybox popup for the usage of an iframe, limited to a certain width and height, you need at least three parameters:
要为 iframe 的使用初始化fancybox 弹出窗口，限制为特定的宽度和高度，您至少需要三个参数：
jQuery
jQuery
$(document).ready(function(){
$(".fancybox").fancybox({
'width' : 600, // set the width
'height' : 600, // set the height
'type' : 'iframe' // tell the script to create an iframe
});
});
You can read all about the available options at the FancyBox API Page.
您可以在FancyBox API 页面阅读有关可用选项的所有信息。
回答by mgraph
Try:
尝试：
$(document).ready(function () {
$(".fancybox").fancybox({"width":400,"height":300});
})
回答by Bhargav Joshi
Hey Use code given below:
嘿 使用下面给出的代码：
fancybox({
afterLoad : function () {
$.extend(this, {
aspectRatio : false,
type : 'html',
width : '90%',
height : '90%',
content : '<div class="fancybox-image" style="background-image:url(' + this.href + '); background-size: cover; background-position:50% 50%;background-repeat:no-repeat;height:100%;width:100%;" /></div>'
});
}
});
回答by Swapnil_Shintre_Pune
This code set size of fancy dynamic @ run time only you have to pass height & width along with page url,to whom you want to set
此代码设置花式动态 @ 运行时的大小，只有您必须将高度和宽度以及页面 url 传递给您要设置的人
Eg: demo.aspx //this statement calls fancy function which is present in your main page
例如：demo.aspx //这个语句调用了你主页上的花式函数
window.parent.SetFancySizeDynamic(YourPageUrl,300,200)
MainPage.aspx
// just add this function in your main page
// 只需在您的主页中添加此功能
function SetFancySizeDynamic(fbHref, fbWidth, fbHeight) {
$.fancybox({
'padding': 0,
'overlayColor': '#ccc',
'type': 'iframe',
'href': fbHref,
'width': fbWidth,
'height': fbHeight
});
}
回答by Shuhad zaman
You Need to set autoSize to false, worked for me
您需要将 autoSize 设置为 false，对我有用
$(".fancybox").fancybox({'width':400, 'height':300, 'autoSize' : false});
$(".fancybox").fancybox({'width':400, 'height':300, 'autoSize' : false});
回答by websky
jQuery(function($){
$(document).ready(function() {
$("#lightwindow").fancybox({
minWidth: 250,
width: 250,
minHeight: 500,
height: 500,
'autoScale': false,
'autoDimensions': false,
'scrolling' : 'no',
'transitionIn' : 'none',
'transitionOut' : 'none',
'type': 'iframe'
});
});
});
回答by sandeep kumar
With iframe
使用 iframe
$(document).ready(function () {
$(".fancybox").fancybox({
width:600,
height:400,
type: 'iframe',
href : 'url_here'
});
})
Without iframe
没有 iframe
$(document).ready(function () {
$(".fancybox").fancybox({
width:600,
height:400,
autoDimensions: false,
});
})
回答by hugotacito
The only way that worked for me was with preload = falseon the iframe:
对我有用的唯一方法是在iframe 上使用preload = false：
$("[data-fancybox]").fancybox({
iframe : {
css : {
height : '1000px',
},
preload : false
},
});
回答by YoJey Thilipan
use this css :)
使用这个 css :)
.fancybox-overlay .fancybox-skin {
max-width: 900px !important;
margin: auto;
}
.fancybox-overlay .fancybox-inner {
max-width: 900px;
margin: auto;
}
.fancybox-overlay .fancybox-skin {
margin: auto;
}
