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

    xiaoxiao2024-11-01  69

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

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

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

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

    解决办法

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

    ?

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    <swiper class="test" .....>

     <swiper-item>

      <image mode='widthFix' ...... />

     </swiper-item>

    </swiper>

     

    <style>

    .text{

      height:200px;

    }

     

    image{

     width:100%;

     height:auto;

    }

    </style>

    总结

    以上所述是小编给大家介绍的微信小程序 swiper 组件遇到的问题及解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对主机吧网站的支持!

    最新回复(0)