怎么让导航栏跟着下面的内容而变化

直接在内容处可以拖动，但是导航栏却没有变化

<script>
        var swiper = new Swiper('.swiper-container', {
          slidesPerView: 1,
          centeredSlides: true,
          spaceBetween: 30,
          grabCursor: true,
          pagination: {
            el: '.nav ul li',
            clickable: true,
          },
        });
    </script>

<script>
         /*点击新房、二手房、租房*/
        $('.nav ul li').click(function(){
            var index = $(this).index();
            $(this).addClass('active').siblings().removeClass('active');
            lists.slideTo(index,500,true);
        })
    </script>请问这里应该怎么写

swiper有这个属性吧
clickable: true,
https://www.swiper.com.cn/api/pagination/69.html