jQuery 如何设置fancybox的高度和宽度?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16711558/
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
How to set fancybox height and width?
提问by Jalpesh Patel
I write a code for the fancybox and its working but i want to set height and width for fancybox but its not working. I use below code.
我为fancybox 及其工作编写了代码,但我想为fancybox 设置高度和宽度,但它不起作用。我使用下面的代码。
Javascript
Javascript
<script type="text/javascript" src="/javascript/jquery/plugins/fancybox/fancybox.js?b84fd"></script>
<script type="text/javascript">
$(document).ready(function() {
/* This is basic - uses default settings */
$("a#single_image").fancybox();
/* Using custom settings */
$("a#inline").fancybox({
'hideOnContentClick': true
});
/* Apply fancybox to multiple items */
$(".iframe").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 600,
'speedOut' : 200,
'overlayShow' : false,
'width' : 600, // set the width
'height' : 600, // set the height
'type' : 'iframe', // tell the script to create an iframe
'scrolling' : 'no'
});
});
</script>
HTML Code
HTML代码
<a id="inline" href="/content/test.html">Test</a>
Please suggest me idea how can i set height and width for fancybox.
请建议我如何为fancybox设置高度和宽度。
I use fancybox in bigcommerce using this links help Big commerce help
我使用此链接在 bigcommerce 中使用fancybox help Big commerce help
Thanks
谢谢
回答by Rinzler
This code works for me settings height and width of an image
此代码适用于我设置图像的高度和宽度
i want to display in fancybox
我想在fancybox中显示
$('#viewlogo').live('click', function(){
$this = $(this);
$.fancybox({
'opacity' : true,
'overlayShow' : true,
'overlayColor' : '#525252',
'width' : 400,
'height' : 400,
'href' : $this.attr('href')
});
return false;
});
<a id="viewlogo" class="iframe" href="<?php echo $orig_image; ?>"><img class ="printhide" src="<?php echo $topic_media_URL; ?>" border="1" width="100" height="100" /></a>
Html code
html代码
<a id="viewlogo" class="iframe" href="<?php echo $orig_image; ?>"><img src="<?php echo $topic_media_URL; ?>" border="1" width="100" height="100" /></a>
回答by Spokey
Fancybox version 1.2.5 is old and doesn't support the parameters you gave. Try using this instead.
Fancybox 1.2.5 版本较旧,不支持您提供的参数。尝试改用它。
$(".iframe").fancybox({
'overlayShow': false,
'frameWidth': 500, // set the width
'frameHeight': 100, // set the height
'type': 'iframe', // tell the script to create an iframe
});
回答by r1si
use this code:
使用此代码:
$(".fancybox-wrap").height($(".fancybox-iframe").contents().find("html").height() + 30);
$(".fancybox-skin").height($(".fancybox-iframe").contents().find("html").height() + 30);
$(".fancybox-inner").height($(".fancybox-iframe").contents().find("html").height());