用layui做轮播图,在手机上宽度异常, 可通过以下方法解决, 不喜欢layui的同学可以选择Swiper

  // 轮播图
  layui.use('carousel', function () {
    var carousel = layui.carousel;
    carousel.render({
      elem: '#banner',
      width: '100%', //设置容器宽度
      height: '100%',
      arrow: 'always', //始终显示箭头
      indicator: 'none',
      //,anim: 'updown' //切换动画方式
    });
  });

  // 响应式轮播图
  window.onload = function () {
    var bannerH = $('#banner img')[0].height;
    $('.layui-carousel').css('height',bannerH+'px');
  }

根据自己元素的id做对应的修改

SRE实战 互联网时代守护先锋,助力企业售后服务体系运筹帷幄!一键直达领取阿里云限量特价优惠。
扫码关注我们
微信号:SRE实战
拒绝背锅 运筹帷幄