欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

微信小程序 swiper 组件遇到的问题及解决方法

程序员文章站 2023-12-17 22:36:28
swiper是纯javascript打造的滑动特效插件,面向手机、平板电脑等移动终端。 swiper能实现触屏焦点图、触屏tab切换、触屏多图切换等常用效果。 swip...

swiper是纯javascript打造的滑动特效插件,面向手机、平板电脑等移动终端。

swiper能实现触屏焦点图、触屏tab切换、触屏多图切换等常用效果。

swiper开源、免费、稳定、使用简单、功能强大,是架构移动终端网站的重要选择!

swiper 组件高度被限制为150px了,所以内容无法撑开。

解决办法

给这组件重新设置个高度,然后在把里面的图片设置为自动适应容器大小。图片模式设置为 宽度不变 自动适应高度

<swiper class="test" .....>
 <swiper-item>
  <image mode='widthfix' ...... /> 
 </swiper-item>
</swiper>

<style>
.text{
  height:200px;
}

image{
 width:100%;
 height:auto;
}
</style>

总结

以上所述是小编给大家介绍的微信小程序 swiper 组件遇到的问题及解决方法,希望对大家有所帮助

上一篇:

下一篇: