Swiper: After define bulletClass, bulletActiveClass is not working

[snowffer]

I need to change some properties of pagination like background-color, so I want to add a self-define class to bulletClass and bullectActiveClass without modifying the default classes which are swiper-pagination-bullet and swiper-pagination-bullet-active.

My js code is like this:

var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination-tab',
        paginationClickable: true,
        paginationBulletRender: function (index, className) {
          return '<span class="' + className + '" >' + index + '</span>';
        },
        bulletClass: 'swiper-pagination-bullet swiper-pagination-bullet-tab',
        bulletActiveClass: 'swiper-pagination-bullet-active swiper-pagination-bullet-tab-active',
        spaceBetween: 0,
    });

Then pagination active EVEN doesn't work. Not even self-define css class swiper-pagination-bullet-tab-active doesn't work, but also the pagination active feature doesn't work!

So I workaround like this:

var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination-tab',
        paginationClickable: true,
        paginationBulletRender: function (index, className) {
          className += " swiper-pagination-bullet-tab";
          return '<span class="' + className + '" >' + index +  '</span>';
        },
        bulletActiveClass: 'swiper-pagination-bullet-active swiper-pagination-bullet-tab-active',
        spaceBetween: 0,
    });

So I wonder is that a bug? Or the way I use namespace bulletActiveClass and bulletClass is wrong?

[nolimits4web]

Yeah, bulletClass and bulletActiveClass should be single class name, not multiple

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.