Swiper中文论坛

标题: swiper上下滑动嵌套左右划动 WAP端箭头问题求大神帮助 [打印本页]

作者: cuidezhu 时间: 2016-11-8 15:41
标题: swiper上下滑动嵌套左右划动 WAP端箭头问题求大神帮助
当嵌套的那个swiper-container不在第一个swiper-slide时，PC端测试，左右滑动箭头显示正常， WAP端需要左右划动一下，这个左右的箭头才出现，求大神帮帮忙，让这个左右箭头默认就显示，这样才方面给别人提示。。

HTML源码如下：


<div class="swiper-container swiper-container-v">
   <div class="swiper-wrapper">
         <div class="swiper-slide">Vertical Slide 1</div>
         <div class="swiper-slide">
            <div class="swiper-container swiper-container-h">
               <div class="swiper-wrapper">
                     <div class="swiper-slide">Horizontal Slide  1</div>
                     <div class="swiper-slide">Horizontal Slide  2</div>
                     <div class="swiper-slide">Horizontal Slide  3</div>
                     <div class="swiper-slide">Horizontal Slide  4</div>
                     <div class="swiper-slide">Horizontal Slide  5</div>
               </div>
               <div class="swiper-pagination swiper-pagination-h"></div>
               <div class="swiper-button-prev swiper-button-black"></div>
                  <div class="swiper-button-next swiper-button-black"></div>

            </div>
         </div>
         <div class="swiper-slide">Vertical Slide 3</div>
   </div>
   
   <div class="swiper-pagination swiper-pagination-v"></div>
</div>

JS源码如下：
   var swiperV = new Swiper('.swiper-container-v', {
         pagination: '.swiper-pagination-v',
         paginationClickable: true,
         direction: 'vertical',
         spaceBetween: 50
   });
   var swiperH = new Swiper('.swiper-container-h', {
         //pagination: '.swiper-pagination-h',
         //paginationClickable: true,
         prevButton:'.swiper-button-prev',
         nextButton:'.swiper-button-next',
         spaceBetween: 50,
         loop: true
   });

欢迎光临 Swiper中文论坛 (http://bbs.swiper.com.cn/)