当幻灯片处于活动状态时，在html元素中设置数据属性

Question

HY，

我正在使用FlexSlider到我的网站（Slider w / thumbnail controlNav pattern），我对缩略图的样式进行了一些修改，我的问题是如何在滑块处于活动状态时在li元素中设置data-thumb属性，在css中他们juste改变img的不透明度我想改变src图像这个类css

  .flex-control-thumbs .flex-active {
  opacity: 1;
  cursor: default;
}

html代码

<div class="flexslider">
              <ul class="slides">

                <li data-thumb="assets/img/nav-slide.png">
                  <img src="assets/img/sld2.jpg" />
                </li>

              </ul>
            </div>

有任何方法可以使用css3设置数据拇指，我希望例如当模式激活的幻灯片缩略图

时

 <div class="flexslider">
              <ul class="slides">

                <li data-thumb="assets/img/active-nav-slide.png">
                  <img src="assets/img/sld2.jpg" />
                </li>

              </ul>
            </div>

Answer 1

这样的东西？

const