how to add jssor transition builder into exisiting slider? - slider

Question

How can I add jssor transition into my slider?
I used the Jssor code like this:
<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...>
Reference: http://www.jssor.com/development/
This above code is working well, but now I'm gonna use this following Transition Code:
{$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}}
Reference: http://www.jssor.com/development/tool-slideshow-transition-viewer.html
Where in this following code can I add this transition?
<sc...>
jQuery(document).ready(function ($) {
var options = { $AutoPlay: true };
var jssor_slider1 = new $JssorSlider$('slider1_container', options);
});
</sc...>

Answer 1

Finally I could find it. Here is the answer:
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);
};
Reference: http://www.jssor.com/development/tool-slideshow-transition-viewer.html