jquery - 如何使 jssor slider 过渡到 FADE？

Question

我目前正在使用全 Angular jssor slider 。

我想拥有以下功能:

• 元素符号过渡
• 淡入淡出过渡
• 禁用拖动，或者如果您使用拖动，它将进行淡入淡出过渡，而不是向左/向右或向上/向下滑动

Answer 1

幻灯片过渡仅以“自动播放”方式播放。

所有按需导航请求(点击元素符号/箭头/缩略图并在任意幻灯片上手动拖动)将导致向左滑动<->向右滑动的效果。

以下代码将启用淡入淡出幻灯片。

<script>
    jQuery(document).ready(function ($) {

        var _SlideshowTransitions = [
        //Fade
        { $Duration: 1200, $Opacity: 2 }
        ];

        var options = {
            ...,
            $SlideshowOptions: {                                //[Optional] Options to specify and enable slideshow or not
                $Class: $JssorSlideshowRunner$,                 //[Required] Class to create instance of slideshow
                $Transitions: _SlideshowTransitions,            //[Required] An array of slideshow transitions to play slideshow
                $TransitionsOrder: 1,                           //[Optional] The way to choose transition to play slide, 1 Sequence, 0 Random
                $ShowLink: true                                    //[Optional] Whether to bring slide link on top of the slider when slideshow is running, default value is false
            }
        };

        var jssor_slider1 = new $JssorSlider$("slider1_container", options);

    });
</script>

引用:http://www.jssor.com/development/slider-with-slideshow-jquery.html

将 $DragOrientation 选项值设置为 0 将禁用拖动。

<script>
    jQuery(document).ready(function ($) {

        var options = {
            ...,
            $DragOrientation: 0
        };

        var jssor_slider1 = new $JssorSlider$("slider1_container", options);

    });
</script>

引用:http://www.jssor.com/development/reference-options.html