var slider = tns({
container: '.my-slider',
items: 5,
autoplay: true,
nav: false,
prevButton: true,
controlsText: ["<",">"],
autoplayButtonOutput: false,
onInit:customizedFunction,
});
function customizedFunction(){
$('.tns-item')
.removeClass('middle')
.removeClass('middle_beside')
.removeClass('next_to_mid')
.removeClass('prev_to_mid');
var middle_item = Math.floor($('.tns-slide-active').length / 2);
$('.tns-slide-active').eq(middle_item).addClass('middle');
$('.tns-slide-active').eq(middle_item + 1).addClass('middle_beside');
$('.tns-slide-active').eq(middle_item - 1).addClass('middle_beside');
$('.tns-slide-active').eq(middle_item + 1).nextAll().addClass('next_to_mid');
$('.tns-slide-active').eq(middle_item - 1).prevAll().addClass('prev_to_mid');
}
var customizedFunction = function (info, eventName) {
$('.tns-item')
.removeClass('middle')
.removeClass('middle_beside')
.removeClass('next_to_mid')
.removeClass('prev_to_mid');
var middle_item = Math.floor($('.tns-slide-active').length / 2);
$('.tns-slide-active').eq(middle_item).addClass('middle');
$('.tns-slide-active').eq(middle_item + 1).addClass('middle_beside');
$('.tns-slide-active').eq(middle_item - 1).addClass('middle_beside');
$('.tns-slide-active').eq(middle_item + 1).nextAll().addClass('next_to_mid');
$('.tns-slide-active').eq(middle_item - 1).prevAll().addClass('prev_to_mid');
}
slider.events.on('indexChanged', customizedFunction);