anythingslider - 带有自定义 FX 的任何滑块，要从左侧插入的 FX 对象，但将幻灯片保留在右侧

Question

我将任何东西与 customFX 一起使用。当我从左侧插入一个对象时，它会向同一个方向消失。如果我想从左边出现但从右边消失怎么办？

Answer 1

FX 扩展是为了做一些相当基本的动画而编写的，所以它还没有允许从一个方向进入和从另一个方向退出的选项。

话虽如此，您可以使用内置的回调函数根据需要为元素设置动画 - 查看此演示：

var fxtime = 1000,
    dist = 300,
    element = 'h3';

$('#slider').anythingSlider({

    // custom FX animation
    onInitialized: function(e, slider) {
        // this could be in the css; but added here for emphasis
        slider.$el.find(element).css('position', 'relative');
        // move title to starting position, if not in view
        slider.$currentPage.siblings().find(element).css({
            top: '-' + dist + 'px'
        });
    },

    onSlideInit: function(e, slider) {
        var $elnext = slider.$targetPage.find(element),
            $ellast = slider.$lastPage.find(element);
        if ($elnext.length) {
            $elnext
                .css({ top: '-' + dist + 'px' })
                // animate element into it's final position
                .animate({ top: 0 }, fxtime);
        }
        if ($ellast.length) {
            // animate element out of view (down, then reset it to the
            // top when finished)
            $ellast.animate({ top: dist + 'px' }, fxtime, function() {
                $ellast.css({ top: '-' + dist + 'px' });
            });
        }
    }
});​