What do I need to change about this slider so that all 3x images change when moving to the next slide, currently only the big image on the left changes when I click the slider arrows.
Here is my site Read-Only:
https://preview.webflow.com/preview/interior-designer-funnel-template?utm_medium=preview_link&utm_source=designer&utm_content=interior-designer-funnel-template&preview=123e9faa66d2951753640620d8529d6a&workflow=preview
[1]: http://](https://interior-designer-funnel-template.webflow.io/
Hey @enver1998
Current situation is happening because you are in fact only triggering it on one place. The thing that might help you would be that you actually transfer click from the arrows for your big slider to the small ones as well. You’d need to assign ID’s to all your elements and use some custom code that will do the transfer
Let’s say your big slider arrows have ID’s “big-slider-prev” and “big-slider-next”
Small sliders would have ID’s: “small-slider-prev-1”, “small-slider-next-1”, “small-slider-prev-2”, “small-slider-next-2”
You’d need a piece of code like this:
<script>
$( "#big-slider-next" ).click(function() {
$( "#small-slider-next-1" ).click();
$( "#small-slider-next-2" ).click();
});
$( "#big-slider-prev" ).click(function() {
$( "#small-slider-prev-1" ).click();
$( "#small-slider-prev-2" ).click();
});
</script>
I’m not 100% sure that this will work but it’s worth a try, let me know how it went