onclick中的fire fancybox功能?模拟正常火灾

时间:2012-12-04 18:35:10

标签: jquery

这对我来说是一个巨大的难题。我会全面解释。

我通常只是像这样点击fancyapps fancybox插件......

$("a.gallery-thumb").fancybox({

    afterLoad   : function() {

        /* shtuff */

    }

});


但是,当点击a.gallery-thumb时,我需要传递一个不相同的变量。这个独特的变量是使用这个...生成的。

FB.Canvas.getPageInfo(function(info) {

    var scrollPosition = info.scrollTop;

};

scrollPosition唯一变量是单击a.gallery-thumb时的当前滚动位置。


所以我需要将scrollPosition变量传递到下面的fancybox函数中。

$("a.gallery-thumb").fancybox({

    afterLoad   : function() {

        $('.fancybox-wrap').css('top', '+=' + scrollPosition + 'px');   

    }

});


现在你可能在想为什么我不这样做......

$("a.gallery-thumb").fancybox({

    afterLoad   : function() {

        FB.Canvas.getPageInfo(function(info) {

            var scrollPosition = info.scrollTop;

            $('.fancybox-wrap').css('top', '+=' + scrollPosition + 'px');   

        };            

    }

    afterShow    : function() { },
    onUpdate     : function() { }

});


好的 - 这很好用,但我需要其他fancybox回调中的scrollPosition变量,例如afterShowonUpdate。但我确定我可以重复FB.Canvas.getPageInfo函数......不完全是,我需要从画廊初始点击开始时生成的原始值。

所以也许我必须做这样的事情,但我似乎无法让它发挥作用,关于如何让下面的脚本工作的任何想法?

$("a.gallery-thumb").on('click', function (){

    event.preventDefault(); /* I'm trying to stop the image opening by default before my fancybox function runs */

    FB.Canvas.getPageInfo(function(info) {

        var scrollPosition = info.scrollTop;

        $(this).attr('rel','fancybox-thumb').fancybox({

            onUpdate   : function() {

                $('.fancybox-wrap').css('top', '+=' + scrollPosition + 'px');

            },

            afterLoad   : function() {

                $('.fancybox-wrap').css('top', '+=' + scrollPosition + 'px');

            },

            afterShow    : function() {

                $('.fancybox-wrap').css('top', '+=' + scrollPosition + 'px');

            },

            onUpdate     : function() {

                $('.fancybox-wrap').css('top', '+=' + scrollPosition + 'px');

            }

        });

    });

});

请参阅js fiddle here仿效我的fancybox函数未触发的问题......

[http://jsfiddle.net/svsdx/1631/][1]

1 个答案:

答案 0 :(得分:1)

为什么不将变量声明向上移动一个级别,以便它在整个函数的范围内?像:

var scrollPosition = 0;
$("a.gallery-thumb").on('click', function (event){

    event.preventDefault(); /* I'm trying to stop the image opening by default before my fancybox function runs */
    FB.Canvas.getPageInfo(function(info) {

        scrollPosition = info.scrollTop;
    });
    return false;
    }).each(function(){

        $(this).attr('rel','fancybox-thumb').fancybox({             
            onUpdate   : function() {   
                $('.fancybox-wrap').css('top', '+=' + scrollPosition + 'px');           
            },                          
            afterLoad   : function() {              
                $('.fancybox-wrap').css('top', '+=' + scrollPosition + 'px');            
        },
            afterShow    : function() {
                $('.fancybox-wrap').css('top', '+=' + scrollPosition + 'px');
            },
            onUpdate     : function() {
                $('.fancybox-wrap').css('top', '+=' + scrollPosition + 'px');
            }
        });
});