Company logo
  • Jobs
  • Bootcamp
  • About Us
  • For professionals
    • Home
    • Jobs
    • Courses
    • Questions
    • Teachers
    • Bootcamp
  • For business
    • Home
    • Our process
    • Plans
    • Assessments
    • Payroll
    • Blog
    • Calculator

0

90
Views
Hide elements while changing slide in swiper js

I am using Swiper js for slides on the page. each slide has another image element positioned part inside the slide image and a part outside of it. so Whenever slide changes the part outside the slide can be seen.

I tries to use overflow: hidden for different classes of swiper js but did not work.

Here is the link you can check the slider: https://project-instock.netlify.app/index1.html#0

7 months ago · Juan Pablo Isaza
1 answers
Answer question

0

I did it by adding fadeEffect: { crossFade: true, }.

Initially, the script was

var swiper = new Swiper('.mySwiper5', {
effect: 'fade',
centeredSlides: true,
pagination: {
el: '.swiper-pagination',
clickable: true,
},
autoplay: {
delay: 7000,
disableOnInteraction: false,
},
});

Which has fade effect enabled but did not mention the kind of fade.

7 months ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post job Plans Our process Sales
Legal
Terms and conditions Privacy policy
© 2023 PeakU Inc. All Rights Reserved.