What's the problem: bxslider doesn't work with mode: fade?

Question

css

I have such a site sweetsugar.demorus.ru
It is the property mode: 'fade' that does not work, but the slides need to be changed with a fade, and not horizontally, as they are changing now. When Fade is set, the slides stay in place, although the pager is spinning, but after the first circle, everything stops altogether.
The BXSlider script is connected like this:

jQuery(function() {
  jQuery('.mainslider ul').bxSlider({
    mode: 'fade',
    speed: 1000,
    auto: true,
    autoDelay: 2000,
    pause: 6000
  });
});

jQuery instead of $ is registered so that there is no conflict with Mootools, since this is Joomla.
Actually, it's useless to change to $, it still doesn't work.

PS: Returned mode:fade to show the error.

Answer 1

Reason is here

jQuery('.mainslider_01').delay(2500).queue(function(){
  jQuery(this).addClass('visible animated fadeIn');
});

After this code, the fadeOut method fired from the bxslider on this element will not work.
I can offer two solutions
1. Remove these machinations from animated.
2. Add dequeue

jQuery('.mainslider_01').delay(2500).queue(function(){
  jQuery(this).addClass('visible animated fadeIn').dequeue();
});

Answer 2

Along with bxslider, two more scripts are downloaded, one of them is jquery.easing.1.3.js
Try to connect this plugin, it might help.