сделал swiper-reviews-img
This commit is contained in:
@@ -859,6 +859,26 @@
|
|||||||
|
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
.reviews-item__img-block{
|
||||||
|
margin-left: 164px;
|
||||||
|
|
||||||
|
width: 577px;
|
||||||
|
height: 600px;
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
object-fit: cover;
|
||||||
|
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.reviews .reviews-item__img-block .swiper-pagination{
|
||||||
|
bottom: 16px;
|
||||||
|
|
||||||
|
padding-right: 0px;
|
||||||
|
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
.reviews .swiper-pagination{
|
.reviews .swiper-pagination{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 32px;
|
right: 32px;
|
||||||
|
|||||||
@@ -665,6 +665,26 @@ main{
|
|||||||
height: 300px;
|
height: 300px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
.reviews-item__img-block{
|
||||||
|
margin-top: 24px;
|
||||||
|
margin-left: 0;
|
||||||
|
|
||||||
|
height: 300px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.swiper-reviews-img{
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.reviews-item__img-block .swiper-slide{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.reviews-item__img-block .swiper-slide img{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
.reviews .swiper-pagination{
|
.reviews .swiper-pagination{
|
||||||
bottom: 87px;
|
bottom: 87px;
|
||||||
|
|
||||||
|
|||||||
@@ -40,6 +40,20 @@ const reviewsSwiper = new Swiper('.reviews-swiper', {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
let reviewsSwiperImg = new Swiper(".swiper-reviews-img", {
|
||||||
|
autoplay: {
|
||||||
|
delay: 2500,
|
||||||
|
disableOnInteraction: false,
|
||||||
|
},
|
||||||
|
pagination: {
|
||||||
|
el: ".swiper-pagination",
|
||||||
|
clickable: true,
|
||||||
|
renderBullet: function (index, className) {
|
||||||
|
return '<span class="' + className + '">' + "</span>";
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
const projectsSwiper = new Swiper('.projects-swiper', {
|
const projectsSwiper = new Swiper('.projects-swiper', {
|
||||||
direction: 'horizontal',
|
direction: 'horizontal',
|
||||||
breakpoints: {
|
breakpoints: {
|
||||||
@@ -284,6 +298,8 @@ phoneInputs.forEach(phoneInput => {
|
|||||||
});
|
});
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// masks end
|
||||||
|
|
||||||
// pc menu
|
// pc menu
|
||||||
|
|
||||||
let blocksMenu = document.querySelectorAll('.header-menu-list-next__block');
|
let blocksMenu = document.querySelectorAll('.header-menu-list-next__block');
|
||||||
@@ -332,6 +348,8 @@ blocksMenu.forEach(block =>{
|
|||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// pc menu end
|
||||||
|
|
||||||
// resize
|
// resize
|
||||||
window.addEventListener('resize', () => {
|
window.addEventListener('resize', () => {
|
||||||
let screenWidth = window.screen.width;
|
let screenWidth = window.screen.width;
|
||||||
|
|||||||
24
index.html
24
index.html
@@ -787,7 +787,28 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
|
<div class="reviews-item__img-block">
|
||||||
|
<div class="swiper swiper-reviews-img">
|
||||||
|
<div class="swiper-wrapper">
|
||||||
|
<div class="swiper-slide">
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="swiper-slide">
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="swiper-slide">
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="swiper-slide">
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="swiper-slide">
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="swiper-pagination"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="reviews__item swiper-slide">
|
<div class="reviews__item swiper-slide">
|
||||||
@@ -907,7 +928,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="swiper-pagination"></div>
|
|
||||||
|
|
||||||
<div class="reviews__counter">
|
<div class="reviews__counter">
|
||||||
<div class="swiper-button-prev"></div>
|
<div class="swiper-button-prev"></div>
|
||||||
|
|||||||
Reference in New Issue
Block a user