Javascript FancyBox 调整宽度

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2398420/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 00:07:09  来源:igfitidea点击:

FancyBox resize width

javascriptjqueryresizefancybox

提问by johnnyArt

I'm able to resize the height with the $.fancybox.resize();part, but the width just doesn't update according to the new content. Thoughts?

我可以用$.fancybox.resize();零件调整高度,但宽度不会根据新内容更新。想法?

回答by TM.

From the fancybox api docs:

fancybox api docs

$.fancybox.resize: "Auto-resizes FancyBox heightto match height of content."

$.fancybox.resize:“自动调整 FancyBox 的高度以匹配内容的高度。”

So it looks like it is not intended to adjust the width.

所以看起来它不是为了调整宽度。

If you wish to adjust the width, you can do it by manually resizing the #fancybox-wrapand #fancybox-innerelements. After some very quick checking, it looks like #fancybox-wrapis set to 20px wider than #fancybox-inner:

如果您想调整宽度,可以通过手动调整#fancybox-wrap#fancybox-inner元素的大小来完成。经过一些非常快速的检查,它看起来#fancybox-wrap比 20px 宽#fancybox-inner

$('#fancybox-inner').width(400);
$('#fancybox-wrap').width(420);

You can also control the width when you first register fancybox using the widthoption:

您还可以使用以下width选项控制第一次注册fancybox时的宽度:

$('#somelink').fancybox({ width: '100px' });

回答by Hannes

In newer versions of fancybox (1.3.4 in my case) use

在较新版本的fancybox(在我的情况下为1.3.4)中使用

$('#fancybox-content').width(600);

instead of

代替

$('#fancybox-inner').width(400);

for manually adjusting the width

用于手动调整宽度

回答by bhattraideb

make some changes in jquery.fancybox.js near about line nubmer:837 change

在 jquery.fancybox.js 附近做一些改变关于线 nubmer:837 改变

current.width = loadingBay.width();

to

current.width = loadingBay.width() + 2*current.padding;

it worked fine to me.

它对我很好。

回答by earachefl

Here's what worked for me:

这对我有用:

$('#fancybox-wrap, #fancybox-outer, #fancybox-content').css('width', 'auto');
$.fancybox.center();

回答by Badar

Just open jquery.fancybox.js and add your own width. Here is my code with width = 72%.

只需打开 jquery.fancybox.js 并添加您自己的宽度。这是我的代码,宽度 = 72%。

// Reset dimensions so we could re-check actual size
        wrap.add(skin).add(inner).width('72%').height('auto').removeClass('fancybox-tmp');