Search code examples
javascriptjquerysliderjssor

Change slide set in Jssor Slider


I have a website with a JSSOR Slider and three icons below it. When I click on an icon I need it to load a certain set of images in the slider. When I click on another icon, I need to load a different set of images and remove the first.

So far I've tried to hide the images I'm not using, etc. I was able to do this, except the thumbnails are still there and load blank slides where I hid the images.

How do you change the slide set without loading three sliders into the page?

Thanks for any help.


Solution

  • Yes, you can refresh content of any slide manually. See jssor slider: How to reload/refresh the slider to show new images

    But in this manner, you can not refresh thumbnails. As there are thumbnails of every slider, The best way is to load 3 sliders at the beginning with lazy loading manner, show 1 and hide another 2.

    Use following format (src2="url") to define lazy loading slide,

    <div><img u="image" src2="url" /></div>
    

    Btw, not sure if the nested slider (3 child sliders in a main slider) meet your needs.