小编给大家分享一下如何解决layui轮播图满屏是高度自适应的问题，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！
在做官网时，遇到轮播图的问题，本来自己写了个轮播图，怎奈有个问题（当我打开页面后去浏览其他页面，回来首页后会有图片会来回闪动，没有正确轮播）一直没有解决。后来看到了layui插件的轮播图，就拿过来用了，但是图片高度不会自适应，图片变形。如图：
解决办法：
实例代码：
计算
安全
数据库
网络和加速
企业服务
var b = 1920/460;//我的图片比例
//获取浏览器宽度
var W = $(window).width();
var H = $(window).height();
layui.use('carousel', function(){
var carousel = layui.carousel;
//建造实例
carousel.render({
elem: '#banner1'
,width: '100%' //设置容器宽度
,height: (W/b).toString()+"px" //按比例和浏览器可视页面宽度来获取高度
,arrow: 'always' //始终显示箭头
//,anim: 'updown' //切换动画方式
});
});
//窗口变化是重新加载
$(window).resize(function () {
// setBanner();
window.location.reload()
})以上是“如何解决layui轮播图满屏是高度自适应的问题”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注亿速云行业资讯频道！
亿速云「云服务器」，即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘，价格低至29元/月。点击查看>>
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
