柚子快报激活码778899分享:实现滑动效果
html
工作在xx
css
.environment {
height: 650px;
background-color: #F6F8FC;
.environment-title {
text-align: center;
font-size: 30px;
font-weight: bold;
padding-top: 80px;
}
.swiper-container {
margin-top: 60px;
//border: 1px solid red;
.swiper-slide {
width: 840px;
height: 360px;
}
}
}
js
var swiper = new Swiper('.swiper-container', {
slidesPerView: "auto",
autoHeight:true,
spaceBetween: 50,
freeMode: true,
// autoplay: {
// delay: 2500,
// disableOnInteraction: false,
// },
// loop: true
});
引入swiper
布局的时候,就要结合一些插件来实现最终效果!
这里的slidesPerView要设置成自动“auto”,否则宽高不好控制。
柚子快报激活码778899分享:实现滑动效果
参考阅读
发表评论