Fade effect with Swiper.js makes links unclickable. How to solve it?

Question

I'm developping a web site on wordpress with the Oxygen builder. I created a dynamic carousel using swiper.js + oxygen repeater. The carousel is set to "effect:fade". When the page loads, there's a kind of animation in which you see each slide stacking up as it enters the screen from right to left. I'd like to remove it, but I don't see how.

initialization animation

The second, more annoying problem is that I can't click on the link. It's like an overlay that's applied automatically. I've noticed that this problem doesn't occur if the:fade effect is deactivated (in which case I switch to a more classic carousel, with a scrolling image).

overlay problem

It's my first time using swiper.js, it's pretty easy to use but I lack the knowledge to solve this problem. Can anyone help me?

Thanks!

I've already tried this configuration:

    var swiper1 = new Swiper('#swiper1 .swiper-container', {
        fadeEffect: { crossFade: true },
        pagination: {
            el: dot1,
            clickable: true,
        },
        
    
    effect: 'fade', 
    loop: true,
        speed: 400,
        touchAction: 'none',
        preventClicks: false,
        preventClicksPropagation: false,

but it doesn't change anything.