2014-10-01 63 views
0

如何添加jssor轉換到我的滑塊? 我用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...> 

回答

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