Javascript 初始化库后修改fancybox选项(边距)
我有一个fancybox版本2.1.4的iframe库,我打开它,然后在父主体(fb iframe外部)中插入一个显示描述的右列。为了正确调整iframe的大小,我在初始化fancybox时在选项中传入了边距:[12034040]。到现在为止,一直都还不错。右边的列是固定的,fancybox在分配给它的空间中可以很好地调整大小 但是,现在我希望用户能够折叠正确的列,并将fancybox iframe扩展到整个页面。让正确的列折叠到40px宽是很容易的。然而,我一辈子都不知道如何将开放式fancybox画廊的右边距从340改为60。api中没有任何内容,SO或google中也没有我能找到的内容,通读源代码也没有帮助。希望有一些简单的东西我只是错过了,但我可以使用一些帮助 作为临时修复,我将当前对象传递给右列加载器并直接修改边距,然后检查右列是否在后加载回调中折叠。丑陋但实用。当然还有更好的办法。$.fancybox.options({newKey:newValue})的api会很好 下面是加载右列的选项代码和函数:Javascript 初始化库后修改fancybox选项(边距),javascript,fancybox,fancybox-2,Javascript,Fancybox,Fancybox 2,我有一个fancybox版本2.1.4的iframe库,我打开它,然后在父主体(fb iframe外部)中插入一个显示描述的右列。为了正确调整iframe的大小,我在初始化fancybox时在选项中传入了边距:[12034040]。到现在为止,一直都还不错。右边的列是固定的,fancybox在分配给它的空间中可以很好地调整大小 但是,现在我希望用户能够折叠正确的列,并将fancybox iframe扩展到整个页面。让正确的列折叠到40px宽是很容易的。然而,我一辈子都不知道如何将开放式fancy
ssTabs.fancyboxOptions = {
scrollOutside: true,
openEffect : 'none',
closeEffect : 'none',
arrows: false,
closeBtn: false,
//using live prevents multiple event handlers when adding content or switching views
live: false,
beforeLoad: function(){
$('.notes_html').css('position', 'relative').css('top', '0').css('left', '0');
},
afterLoad: function(current, next) {
var marginsOpen = [80, 340, 20, 20];
var marginsCollapsed = [80, 60, 20, 20];
var marginsPhone = [60, 0, 0, 0];
var margins = marginsOpen;
if ($('body').hasClass('fb_rc_collapsed')) {
margins = marginsCollapsed;
}
if ($('body').hasClass('mobile')) {
console.log('setting fb margins to mobile');
margins = marginsPhone;
}
ssTabs.addFbMenuBar(current);
console.log('current: ', current);
if(current.type === "inline" || current.type === "iframe") {
current.minHeight = "100%";
current.minWidth = "100%";
}
if(current.type === "iframe") {
this.margin = margins;
//current.maxWidth = 1200;
}
},
beforeClose: function(){
$('.notes_html').css('position', 'absolute').css('top', '-9999px').css('left', '-9999px');
},
afterClose: function(){
ssTabs.removeFbMenuBar();
},
iframe: {
preload: false
},
padding: 5,
margin : [120, 340, 40, 40],
mouseWheel: false,
helpers: {
title: null,
overlay : {
closeClick : false
}
}
};
ssTabs.addFbMenuBar = function(current) {
zim.currentFbElement = current;
var thisElement = current.element[0].dataset;
var options = {};
options.mySphere = zim.mySphere || false;
options.sphereOwner = zim.thisSphereOwner;
var contentArray = {content: zim.objectDictionary[thisElement.id]};
var context = $.extend({}, contentArray, options);
console.log('fb context: ', context);
var template = 'fb_overlay';
var location = '#gallery_right_column';
console.log('inserting fb_menu_bar');
$(location).handlebars(template, context, {}, checkForMobile);
function checkForMobile() {
if ($('body').hasClass('mobile')) {
$('.fb_rcolumn').hide();
}
}
};
右栏是否从iframed页面中插入?还是将其插入fancybox容器内的iframe顶部(从打开的fancybox的父页面)。。。我不应该问这个,你应该展示你的代码。代码发布。我认为这是显而易见的,但我也离问题太近了。我还包括了一个功能性的、但丑陋的解决方法。我不敢相信没有一个直接的方法来修改开放的fb画廊的选项,但也许是这样的。它似乎不在文档或代码中。