Question

Swiper.js slider高度不能适应怎么解决

Answer 1

swiper.js 没有限制slider的高度，因为考虑到图片的不规则性，限制了高度，对于一些过大或者过小的图片会造成失真，你可以通过自己设置slider的高度，通过overflow:hidden来避免失真。

Answer 2

操作如下：

1，首先引入核心文件js，以及自带的默认css样式表

<link rel="stylesheet" href="../dist/idangerous.swiper.css" rel="external nofollow" ><script defer src="../dist/idangerous.swiper.min.js"></script>

2，HTML结构以及插件初始化配置，输入以下代码：

<div class="device">
<a class="arrow-left" href="#" rel="external nofollow"  rel="external nofollow" ></a>
<a class="arrow-right" href="#" rel="external nofollow"  rel="external nofollow" ></a>

Answer 3

$(window).resize(function(){
var h=$(".swiper-slide").find("img").height();
$(".swiper-wrapper,.swiper-slide").css("height",h)
})

Answer 4

修改Swiper.css中的css即可，即：
.swiper-container {
/* Specify Swiper's Size: */
width: 100%;
height: 5rem;
}
.swiper-slide {
/* Specify Slides's Size: */
width: 100%;
height: 100%;
}

Answer 5

onSlideChangeStart: function() {var H = $(".content-slide").e(tabsSwiper.activeIndex).height();$(".swiper-slide").css('height', H + 'px');$(".swiper-wrapper").css('height', H + 'px');}这段放里面试试