@{
    string templateDirectory = ViewBag.TemplateDirectory;
}

<div class="swiper-container banner" id="banner">
    <div class="swiper-wrapper">
        <div class="swiper-slide"><img src="@templateDirectory/images/banner-1.jpg"></div>
        <div class="swiper-slide"><img src="@templateDirectory/images/banner-2.jpg"></div>
    </div>
    <!-- 如果需要分页器 -->
    <div class="swiper-pagination"></div>

    <!-- 如果需要导航按钮 -->
    <div class="swiper-button-prev swiper-button-white"></div>
    <div class="swiper-button-next swiper-button-white"></div>
    <!-- 如果需要滚动条 -->
    <div class="swiper-scrollbar hidden"></div>
</div>

<script>
    var mySwiper = new Swiper('#banner', {
    //direction: 'vertical', // 垂直切换选项
    loop: true, // 循环模式选项

    // 如果需要分页器
    pagination: {
      el: '.swiper-pagination',
    },

    // 如果需要前进后退按钮
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },

    // 如果需要滚动条
    scrollbar: {
      el: '.swiper-scrollbar',
    },
  })
</script>
