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

Add option to allow control of where the prev/next arrows are placed #20

Closed
3 tasks done
jasonwebb opened this issue Oct 1, 2020 · 1 comment
Closed
3 tasks done
Labels
new feature New feature to add to the package

Comments

@jasonwebb
Copy link

jasonwebb commented Oct 1, 2020

Depending on the visual design and the number of slides shown for any given carousel, the logical tab sequence of all the controls and slide content can vary. Though we do always know how many slides are shown at any time, we can't really infer the visual design in order to programmatically move controls around in the DOM to be logical.

Let's create a new option that developers can use to make accessible-slick place the arrow icons at particular places in the DOM structure of the carousel. I'm thinking the following places are most useful:

  1. Place both arrow buttons before the slides.
  2. Place both arrow buttons after the slides.
  3. Place the previous button before the slides, and the next button after the slides.
  • Expose a new option (arrowPlacement?) that accepts a string that needs to match one of the following: "beforeSlides", "afterSlides", "split".
  • Document this new option and accepted values in the main README
  • Create a CodePen demo using this new setting.
@jasonwebb jasonwebb added the new feature New feature to add to the package label Oct 1, 2020
@jasonwebb
Copy link
Author

The new arrowsPlacement setting is used in this hero banner sample on CodePen: https://codepen.io/A360/pen/zYqKvXN

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
new feature New feature to add to the package
Projects
None yet
Development

No branches or pull requests

1 participant