基于layui轮播图满屏是⾼度⾃适应的解决⽅法
在做官⽹时，遇到轮播图的问题，本来⾃⼰写了个轮播图，怎奈有个问题（当我打开页⾯后去浏览其他页⾯，回来⾸页后会有图⽚会来回闪动，没有正确轮播）⼀直没有解决。后来看到了layui插件的轮播图，就拿过来⽤了，但是图⽚⾼度不会⾃适应，图⽚变形。如图：
解决办法：
实例代码：
var b = 1920/460;//我的图⽚⽐例
//获取浏览器宽度
var W = $(window).width();
var H = $(window).height();
layui.use('carousel', function(){
var carousel = layui.carousel;
//建造实例
elem: '#banner1'jquery自动轮播图代码
,
width: '100%' //设置容器宽度
,height: (W/b).toString()+"px" //按⽐例和浏览器可视页⾯宽度来获取⾼度
,arrow: 'always' //始终显⽰箭头
//,anim: 'updown' //切换动画⽅式
});
});
//窗⼝变化是重新加载
$(window).resize(function () {
// setBanner();
load()
})
以上这篇基于layui轮播图满屏是⾼度⾃适应的解决⽅法就是⼩编分享给⼤家的全部内容了，希望能给⼤家⼀个参考，也希望⼤家多多⽀持。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。