有没有办法将初始化函数传递给Orbit幻灯片？

Question

我解决了我原来的问题,但我想知道是否有一个更优雅的解决方案.我正在使用Foundation的Orbit创建幻灯片.这不是简单的幻灯片放映,它是幻灯片放映,其中每个幻灯片都定义了数据标题,并且在此数据标题中有HTML需要加载模式对话框.

如果您正在使用Foundation,您会立即考虑使用Reveal库来调出模式对话框,我会这样做,但要求使用prettyPhoto.(这些是要求.)问题是数据标题中的元素不受原始初始化调用的影响:

$("a[rel^='prettyPhoto']").prettyPhoto();

我需要做的是确保在加载时初始化每个数据标题.好吧,这是问题所在.我已经使用afterSlideChange事件解决了幻灯片过渡问题,但问题是第一张幻灯片.我需要为显示的第一张幻灯片调用此方法.

这是解决此问题的代码:

<script type="text/javascript">
$(window).load(function () {
    $('#featured').orbit({
        afterSlideChange:function () {
            $("a[rel^='prettyPhoto']").prettyPhoto({
                default_width:640,
                default_height:500,
                theme:'light_square'
            });
        }, // empty function
        fluid:true                         // or set a aspect ratio for content slides (ex: '4x3')
    });
    $("a[rel^='prettyPhoto']").prettyPhoto({
        default_width:640,
        default_height:500,
        theme:'light_square'
    });
});
</script>

有没有更好的方法来做到这一点,而不必复制该代码.我应该定义自己的"initializeSlide"事件,还是有一些答案我只是缺少？

Answer 1

轨道滑块没有公开那么多方法。幸运的是，有一些简单的解决方法。

例如，您可以这样设置：

$(window).load(function () {
    var sliderChanged = (function sliderChanged(prevActive, active) {
        $("a[rel^='prettyPhoto']").prettyPhoto({
            default_width: 640,
            default_height: 500,
            theme: 'light_square'
        });
        return sliderChanged;
    }());
    jQuery('#featured').orbit({
        afterSlideChange: sliderChanged,
        fluid: true
    });
});