search

yifaneye / react-gallery-carousel

Carousel component 🎠🎠🎠 supporting touch, mouse, keyboard, thumbnails, fullscreen, lazy loading, SSR and customisations. 👉 Live editor: https://yifanai.com/rgcd1
https://yifanai.com/rgc
MIT License
215 stars 30 forks source link

Only show the first image #89

Open moham96 opened 1 year ago

moham96 commented 1 year ago

Describe the bug Only the first image is rendered, if I select another image it will just show a black background, thumbnails are rendered below correctly but when selecting any image other than the first it shows as black background

To Reproduce Steps to reproduce the behavior: 1- run the example code in the "Usage" section of the readme 2- select a slide other than the first one, you will see a black screen

Expected behavior All slides should render correctly

Screenshots Screenshot 2023-05-11 at 1 56 51 PM

Desktop (please complete the following information):

Smartphone (please complete the following information): Not tested

Additional context N/A

moham96 commented 1 year ago

update: This only happens if the html tag of the page has dir="rtl"

yifaneye commented 1 year ago

Hi @moham96 ! Thanks for raising this issue!

I can replicate this issue. I didn't know the use of <html > dir="rtl". I am sorry for the inconvenience! I think I need to change this line. I will keep you updated.

moham96 commented 1 year ago

Current workaround is to force ltr just for the carousel element by wrapping the carousel component with

<div dir="ltr">
 <ReactGalleryCarousel></ReactGalleryCarousel>
</div>
yifaneye commented 1 year ago

Okay. Thanks for sharing! I will try to resolve the issue.