Question

我想在这里提出一个问题，我已经在swiper的developers forum中提出了这个问题。所以不要混淆。如果找到解决方案，我将关闭/标记两者。

目前我想要一个项目水平滚动侧边栏和垂直滚动页脚。（基于Swiper）但是看看自己如果从水平（1）页脚切换到垂直（2）页面会发生什么。

Video 1 (direction both horizontal - not wanted)

Video 2 (footer direction vertical, wanted! - not works)

如您所见，在简化示例（视频2）上：如果我在第二个swiper-container上使用 direction：vertical ，则会破坏结果。 “swiper-slide”的高度应该是226px，现在出现2408px的高度和100px的MARGIN-BOTTOM。

我真的无法理解这里出了什么问题。

ConfInit

var swiper = [];
    $('.swiper-container').each(function(index){

        var $el = $(this);

        var sParams = [{
                speed: 400,
                spaceBetween: 100,
                allowSwipeToNext: false, // for event controlled swipes 
                allowSwipeToPrev: false  // for event controlled swipes 
            },
            {
                speed: 400,
                spaceBetween: 100,
                allowSwipeToNext: false, // for event controlled swipes 
                allowSwipeToPrev: false, // for event controlled swipes 
                direction: 'vertical'
            }
        ];

Answer 1

我遇到了同样的问题，通过向 swiper 容器添加 height: 100vh 声明解决了。

发现

height 属性是必须的

注意： % 不起作用

刮水器（高度问题 - 多个刮水器 - 垂直方向）

1 个答案:

发现