（光滑幻灯片）滑块，带有动态第一张幻灯片

Question

我有一个页面上有一堆图像。我有这些图像的光滑滑块。无论我点击什么图像，我总是将第一张图像视为第一张幻灯片。
结构：

#slick-slider
  .slider-for
    .div
      .image{id='<%= @product.id %>'}
    .div
      .image{id='<%= @product.id %>'}
    .div
      .image{id='<%= @product.id %>'}

  .slider-nav
    .div
      .image{id='<%= @product.id %>'}
    .div
      .image{id='<%= @product.id %>'}
    .div
      .image{id='<%= @product.id %>'}

我试过了：

$('.slider-for').slick('slickGoTo', $("[id=<%= @product.id %>]"));

我需要转到我点击的滑块中的图像。

将不胜感激任何帮助。 亚历克斯。

UPD：

更多细节： 单击图像后，滑块将在模态窗口中打开。 假设每个“图像”块都有唯一的ID，我如何关注脚本的某些id？

.image{id='x'}

$('.slider-for').slick('slickGoTo', $("[id=<%= x %>]"));

这不起作用。