swiper幻灯片窗口大小变化以及container容器宽度变化时会导致图片宽度与容器宽度不一样,出现错乱,经过一番查询,可以在swiper的初始化里加以下代码
resizeObserver: true, //窗口容器变化 on: { resize: function(){ this.update(); //窗口变化时,更新Swiper的一些属性,如宽高等 }, }
但是,这个代码仅对浏览器窗口变化有效,container容器大小变化时无效,那么怎么解决呢?
可以动态获取容器的宽度,修改容器的宽度,但是我们不能直接获取容器的宽度,只能通过窗口的宽度减去其他div的宽度,计算出最新的容器的宽度。
var ddd = window.innerWidth - 90 - $(".sidebar-left").width(); swiperHome.el.style.width = ddd+'px';
大概就是这样,解决了困扰我俩小时的问题。
0 个评论