dzuz14/react-hooks-image-slider

Image Slider built with React Hooks.

react-hooks-image-slider's Issues

Reset the Interval

My opinion, if click on the next button (autoplay on), it should restart the interval. WDYT?

Stop autoplay

My initial idea is to let the parent component that contains the Slider control whether autoplay is active. That would require setting autoPlay to a state variable. You'd end up passing the autoPlay variable, and a function to stop autoplay down to the Slider as props. The nextSlide and prevSlide functions would then need to have additional logic added to handle stopping the autoplay by executing the function passed down as props.

Perhaps instead, you could display some type of icon that would allow the user to toggle autoplay by clicking on it. We wouldn't attach that functionality to the arrows at all, removing the necessity of refactoring are prevSlide and nextSlide function.

Let me know what your ideas are.

Responsive translate

Hello, I found a issue when I resize the window or container of slide.

The scenarie is:

• Load slide in the screen
• After click in arrow right to traslate the current slide
• Then resize the window or dimensions of container
• Then you can see that the currrent value of translateX are not is valid, because the slide are not visible correctly

Requesting for AutoPlay feature

How it could implement autoplay slider

• adding a delay timer for 2 seconds and play next. How should I?

Overlaping component

When used as child components, the slider overlaps.That is overflows What should i do?

Is it possible to change slide transition to any animation on previous and next.

I tried out adding an animation on transform translateX but facing issue like images not rendering to view. Can anyone have idea to add a animation on previous and next.

Multiple sliders on the same page

When trying to use two (or more) sliders at the same time, the last one works properly but any other one transitions back and forth to active slide when arrows are clicked. I don't know why but smoothTransition is called twice so it transitions, then the slides are updated and then it transitions again.

Any clue on why is this happening?

autoplay

whoops. need to pass autoplay via redux prop in settings

Multiple images per slide

I am thinking that we might want to use real <img /> elements instead of a div that sets the images as a background.

For example:
Let's say you want 3 images per slide, you could then use the srcset attribute to show different sized images dependent on the width of the browser. This would require the developer(s) to create multiple copies of their images at different sizes prior to utilizing the Slider properly.

I think at least at first glance this is a decent idea, as it accounts for performance and won't load large image files on smaller devices.

Images end up not appearing after one cycle on mobile (iOS and Chrome)

Upon navigating slide show on iPhone using chrome I experienced that after clicking the right arrow to go through all images it goes back to the first image but no images would be displayed.

Should be able to click on radio button to change to corresponding image.

• radio buttons currently do nothing (apart from changing color).
• It would be good if we could change image by clicking on those buttons.

good work though

Problem with node-sass, old version has been removed. Gotta update to latest (at least 4.12.0);)