search

akiran / react-slick

React carousel component
http://react-slick.neostack.com/
MIT License
11.62k stars 2.09k forks source link

Customize arrows and dots inside a div so that we can position the main div of arrows and dots anywhere for Next.js 14. #2351

Open Irshadraza opened 4 months ago

Irshadraza commented 4 months ago

I want to customise the arrows and dots inside a div as below code

<div className={stockSliderIcons ${styles.SliderCommonIcons}}> <div className={slick-prev slick-arrow ${styles.arrowIcon}} onClick={prevSlide}

<span className={eticon_prev ${styles.commonArrow}}>

<div className={slick-next slick-arrow ${styles.arrowIcon}} onClick={nextSlide}

<span className={eticon_next ${styles.commonArrow}}> 

  for the design

Pagination

Kindly help me to slick slider code for the same.

advanceddev commented 3 months ago

u can create custom dots and arrows + use ref for catch control

xiemic commented 3 months ago

also interested in this topic

@advanceddev how do you create custom dots?

for the arrows you can apparently use ref and then call slickPrev() and slickNext()