Question

如何将jssor过渡添加到我的滑块？我使用了这样的Jssor代码：

<script src="js/jssor.slider.mini.js"></script>
<sc...>
jQuery(document).ready(function ($) {
    var options = { $AutoPlay: true };
    var jssor_slider1 = new $JssorSlider$('slider1_container', options);
});
<sc...>

参考：http://www.jssor.com/development/

以上代码运行良好，但现在我将使用以下转换代码：

{$Duration:1500,x:0.2,y:-0.1,$Delay:20,$Cols:8,$Rows:4,$Clip:15,$During:{$Left:[0.3,0.7],$Top:[0.3,0.7]},$SlideOut:true,$Formation:$JssorSlideshowFormations$.$FormationZigZag,$Assembly:260,$Easing:{$Left:$JssorEasing$.$EaseInWave,$Top:$JssorEasing$.$EaseInWave,$Clip:$JssorEasing$.$EaseOutQuad},$Outside:true,$Round:{$Left:0.8,$Top:2.5}}

参考：http://www.jssor.com/development/tool-slideshow-transition-viewer.html

以下代码中的哪个位置可以添加此转换？

<sc...>
jQuery(document).ready(function ($) {
    var options = { $AutoPlay: true };
    var jssor_slider1 = new $JssorSlider$('slider1_container', options);
});
</sc...>

Answer 1

最后我能找到它。这是答案：

    jssor_slider1_starter = function (containerId) {
    //Define an array of slideshow transition code
    var _SlideshowTransitions = [
    {$Duration:1500,x:0.2,y:-0.1,$Delay:20,$Cols:8,$Rows:4,$Clip:15,$During:{$Left:[0.3,0.7],$Top:[0.3,0.7]},$SlideOut:true,$Formation:$JssorSlideshowFormations$.$FormationZigZag,$Assembly:260,$Easing:{$Left:$JssorEasing$.$EaseInWave,$Top:$JssorEasing$.$EaseInWave,$Clip:$JssorEasing$.$EaseOutQuad},$Outside:true,$Round:{$Left:0.8,$Top:2.5}}
    ];
    // And you can add more transitions to the array. 
    var options = {
        $AutoPlay: true,
        $SlideshowOptions: {
                $Class: $JssorSlideshowRunner$,
                $Transitions: _SlideshowTransitions,
                $TransitionsOrder: 1,
                $ShowLink: true
            }
    };
    var jssor_slider1 = new $JssorSlider$(containerId, options);
};

参考：http://www.jssor.com/development/tool-slideshow-transition-viewer.html

如何将jssor transition builder添加到现有幻灯片中？

1 个答案: