.slider1 {position:relative; overflow:hidden; width:100%; height:100vh;} .swiper { width: 100%; height: 100%; } .swiper-slide { text-align: center; font-size: 18px; background: #fff; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; } .swiper-slide .txt {position:relative; z-index:3;} .swiper-slide .txt h1{font-size:75px; color:#fff !important; margin-top:60px; } .swiper-slide .txt h2 {font-size:20px; color:#fff; margin-top:-60px;} .swiper-slide .txt a {display:inline-block; font-size:14px; padding:12px 38px; color:#fff; background:none; border:1px solid #fff; margin-top:25px;} .swiper-slide .txt a:hover {color:#fff; background:#119fe7; border:1px solid #119fe7;} .swiper-slide .overay {position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.4); z-index:2} .swiper-slide .bg1 {position:absolute; top:0; left:0; width:100%; height:100%; background:url('/img/1.jpg')no-repeat center; background-size:cover; z-index:1} .swiper-slide .bg2 {position:absolute; top:0; left:0; width:100%; height:100%; background:url('/img/2.jpg')no-repeat center; background-size:cover; z-index:1} .swiper-slide .bg3 {position:absolute; top:0; left:0; width:100%; height:100%; background:url('/img/3.jpg')no-repeat center; background-size:cover; z-index:1} .swiper-slide .bg4 {position:absolute; top:0; left:0; width:100%; height:100%; background:url('/img/4.jpg')no-repeat center; background-size:cover; z-index:1} .swiper-slide .bg5 {position:absolute; top:0; left:0; width:100%; height:100%; background:url('/img/5.jpg')no-repeat center; background-size:cover; z-index:1} .swiper-pagination-bullet {width:10px; height:10px; background:none; border:3px solid #fff;} @media screen and (max-width:1024px) { .swiper-slide .txt h1{font-size:55px;} } @media screen and (max-width:600px) { .swiper-slide .txt h1{font-size:30px;} .swiper-slide .txt h2{font-size:12px; margin-top:-20px;} .swiper-slide .txt a {font-size:11px; padding:8px 25px; margin-top:10px;} } var swiper = new Swiper(".mySwiper", { direction: "vertical", slidesPerView: 1, autoplay: { delay: 2500, disableOnInteraction: false, }, loop:true, spaceBetween: 30, mousewheel: true, pagination: { el: ".swiper-pagination", clickable: true, }, on: { reachEnd: function () { swiper.mousewheel.disable(); } } }); window.addEventListener('wheel', function (event) { if (event.deltaY 0) { } });