我为fancybox编写代码及其工作但我想设置fancybox的高度和宽度,但它不起作用。我使用下面的代码。
的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代码
<a id="inline" href="/content/test.html">Test</a>
请建议我如何设置fancybox的高度和宽度。
我使用此链接帮助Big commerce help
在bigcommerce中使用fancybox由于
答案 0 :(得分:3)
此代码适用于我设置图像的高度和宽度
我想在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代码
<a id="viewlogo" class="iframe" href="<?php echo $orig_image; ?>"><img src="<?php echo $topic_media_URL; ?>" border="1" width="100" height="100" /></a>
答案 1 :(得分:3)
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
});
答案 2 :(得分:1)
使用此代码:
$(".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());