Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Empty spae/gap after refresh and moving slider #1293

Open
2 tasks done
Reg93 opened this issue Mar 28, 2024 · 0 comments
Open
2 tasks done

Empty spae/gap after refresh and moving slider #1293

Reg93 opened this issue Mar 28, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@Reg93
Copy link

Reg93 commented Mar 28, 2024

Checks

Version

0.7.12

Description

Hello! Thank you for your work!

Have an issue with slider and i couldn't find similar problem in issues. I have request to make infinite vertical loop with centered slide.

What i wrote:

<Splide hasTrack={false} options={{ rewind: true, width: 300, type: 'loop', direction: 'ttb', height: '150px', perPage: 3, drag : 'free', focus : 'center', trimSpace: true }} className="swiper" > <SplideTrack> {swiperLenght.map((item, index) => ( <SplideSlide key={index} className="swiper-slide"> {item} </SplideSlide> ))} </SplideTrack> </Splide>

styles:

`
.swiper {
overflow: hidden;
border: 1px solid grey;
display: flex;

  .splide__slide{
    height: 40px;
    font-size: 36px;
  }

}
`

What i see:

after refresh there are no numbers at all:
image

after start move i see gaps on top and bottom:
image

Help please to fix this. Respect

Reproduction Link

No response

Steps to Reproduce

copy my code

Expected Behaviour

infinite vertical loop with centered slide without empty spaces

@Reg93 Reg93 added the bug Something isn't working label Mar 28, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
1 participant