Menu icon Foundation
Issue with Interchange and Slick Slider

Hello, I have the following issue with Interchange and Slick Slider.

Both Interchange and the Slider are working fine, the only issue is that for some reason the last element of the slider doesn't interchange content (images).

I tried with fade set to true and it doesn't have issues, but when it's slide the last image problem occurs.

You can check the issue here:
http://zebradm.mx/dev/aluxes.com.mx/ there are 3 images in the slider.

You can check when the issue doesn't occur using Fade: true:
http://zebradm.mx/dev/aluxes.com.mx/galeria/

What could be happening?

interchangeSlick Slider

Hello, I have the following issue with Interchange and Slick Slider.

Both Interchange and the Slider are working fine, the only issue is that for some reason the last element of the slider doesn't interchange content (images).

I tried with fade set to true and it doesn't have issues, but when it's slide the last image problem occurs.

You can check the issue here:
http://zebradm.mx/dev/aluxes.com.mx/ there are 3 images in the slider.

You can check when the issue doesn't occur using Fade: true:
http://zebradm.mx/dev/aluxes.com.mx/galeria/

What could be happening?

Tobias Malikowski about 5 years ago

Hi Mihail,

i've the same issue with Interchange and Slick Slider. It seems that this always happens to the last slide.
If i use Interchange for the first 2 slides and a normal image without Interchange for the 3 slide it quite works well.

Does anyone has a solution for this issue? I mean Zurb is recommending the Slick Slider (which is pretty awesome by the way), but it has to work with the Foundation Interchange feature.

Tobias Malikowski about 5 years ago

Some guys managed to fix that issue. But they had to modify the interchange source code.
It would be nice if some guys from the Foundation Team could check that.

Here is the link: https://github.com/kenwheeler/slick/issues/424

Matt Jensen about 5 years ago

FYI it's a one line fix in foundation.interchange.js v5.4.3. All I had to do was replace line 52:

 el[0].src = path;

With:

 $.each(el, function(){this.src = path;});