Swiper组件首次滑动无惯性异常问题求助

我遇到了一个Swiper组件的异常问题：首次几次滑动时，组件会直接跳转到松开时对应的幻灯片，完全没有滑动惯性，视觉体验极差。几次滑动后组件恢复正常，但刷新页面后问题会再次出现。

问题出在网站左侧移动端导航面板的Swiper组件上，由于启用了cssMode，只能通过触摸操作测试。网站地址：instabrewdevelopment.myshopify.com

我的Swiper配置代码如下：

function navCarouselSettings(el){
        
  el.removeClass();
  el.addClass('swiper');
        
  new Swiper(el[0], {
    spaceBetween: 12,
    cssMode: true,
    slidesPerView: 'auto'         
  });
        
}

另外我做了以下CSS修改：

.mobileNavBar .swiper {
    overflow: visible;
    padding-bottom: 40px;
  }
  
  .mobileNavBar .swiper-wrapper {
    scroll-padding-left: 18px;
    scroll-padding-right: 8px;
    padding-left: 18px;
    padding-right: 8px;
  }

不确定这些CSS修改是否导致问题，但始终找不到根源。我已经尝试过设置threshold、移除部分CSS属性等方法，均未解决问题，恳请各位提供帮助！

内容的提问来源于stack exchange，提问作者caleb_3431x