jquery - Fancybox，自定义开放过渡

Question

有谁知道如何使用自定义打开过渡打开 fancyBox:

http://fancyapps.com/fancybox/

我希望实现与此处示例类似的转换:

http://www.zurb.com/playground/reveal-modal-plugin

我喜欢 Reveal 插件，但它没有一些我需要 fancyBox 为新项目提供的功能

非常感谢，

山姆

Answer 1

添加自定义过渡 -

(function ($, F) {
    F.transitions.dropIn = function() {
        var endPos = F._getPosition(true);

        endPos.top = (parseInt(endPos.top, 10) - 200) + 'px';

        F.wrap.css(endPos).show().animate({
            top: '+=200px'
        }, {
            duration: F.current.openSpeed,
            complete: F._afterZoomIn
        });
    };

    F.transitions.dropOut = function() {
        F.wrap.removeClass('fancybox-opened').animate({
            top: '-=200px'
        }, {
            duration: F.current.closeSpeed,
            complete: F._afterZoomOut
        });
    };

}(jQuery, jQuery.fancybox));

像这样使用它们 -

$(".fancybox").fancybox({
    openMethod : 'dropIn',
    openSpeed : 250,

    closeMethod : 'dropOut',
    closeSpeed : 100
});

哇啦 - 同样的效果!