• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

196
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

almost 3 years 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.

almost 3 years 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 vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error