akiran / akiran/react-slick

variableWidth: true, infinite: false not disabling the next arrow button when the last element enters the viewport

Open
#2,367 3 comments 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
11.9k
Forks
2.1k
PR merge metrics
No merged PRs in 30d

Description

Issue:

When variableWidth is "true" and infinite is set to "false", next button does not get disabled when the last element enters the viewport. It keeps on scrolling leaving a whitespace after the last element.

Also is there any easier way to calculate "slidesToShow" variable? Max possible number of elements should be present in the screen and "slidesToScroll" should be "slidesToShow - 1" or 1 whichever is the higher.

```
const settings: Settings = {
className: "slider variable-width",
dots: false,
infinite: false,
centerMode: false,
variableWidth: true,
slidesToShow: numSlides,
slidesToScroll: numSlides,
};
```

```

{data.map((el, i) => {
return (


{el}

);
})}

```

Screenshot 2024-04-09 at 1 54 58 AM

Code sandbox:
https://codesandbox.io/embed/ncsf68?view=Editor+%2B+Preview&module=%2Findex.js

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.