禁止使用模板插件做违法内容(涉黄等),否则将受到法律的制裁。

swiper幻灯片窗口大小变化以及container容器宽度变化时导致图片宽度问题

禁止使用模板插件做违法内容(涉黄等),否则将受到法律的制裁。

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 个评论

 
联系
目前暂停一切业务,客服消息可能不会及时回复,谢谢理解。
在线咨询
    在线咨询
    禁止使用模板插件做违法内容(涉黄等),否则将受到法律的制裁。