将幻灯片状态类添加到 Revolution Slider 容器答案

【问题标题】：Add slide state class to Revolution Slider container将幻灯片状态类添加到 Revolution Slider 容器
【发布时间】：2016-01-30 12:44:12
【问题描述】：

LIVE DEMO

我的 3-slides revslider 顶部有一个静态层。当滑块到达第三张幻灯片时，我想更改静态层中的某些内容。

当前，当滑块到达 li 元素时，它会为它提供一个“.current-sr-slide-visible”类，但是这样我就不能用 CSS 定位静态层，因为它在父容器中......

这是我的滑块（简化，只是结构，完整代码见上面的链接）：

<div class="revslider">
  <ul class="slides">
  ...
  <li id="slide3">...</li>
  </ul>
  <div class="static-layer">
  <svg class="logo"></svg>
  </div>
</div>

edit：所以我想将任何“slide3”指示器添加到任何元素，而不是 li 元素。如果我可以将指标类放在 ul、容器或徽标本身上，那就太好了。

我试过这个（这在页面上的其他任何地方都可以工作，但不能使用所需的滑块，不知道为什么）：

$(function(){
    if($('#slide3').hasClass('current-sr-slide-visible')) {
        $('.logo').addClass('white-logo');
    }
});

edit2：通过 revslider api 进行了尝试，但是这有问题，无法正常工作...如果您能看出这是什么问题，这可能是一个更好的解决方案：

jQuery(document).ready(function() {
    var revapi = jQuery('.revslider').show().revolution(
    {
    // ...slider settings
    });

 // event for when slide is changed
 revapi.on('revolution.slide.onchange', function(e, data) {

    // slider changed
    var currentSlideNumber = data.slideindex;
    $('.revslider').addClass(currentSlideNumber);
});
});

如有任何帮助，将不胜感激。

滑块版本： * jquery.themepunch.revolution.js - 用于革命滑块的 jQuery 插件 * @版本：4.6.4 (26.11.2014)

【问题讨论】：

尝试为此使用幻灯片更改事件。还要提及插件版本并提供插件站点的链接
任何可用的现场演示？
你能告诉我怎么做吗？ :) 添加了版本详情

标签： jquery revolution-slider

【解决方案1】：

<div id="revslider">
  <ul class="slides">
  ...
  <li id="slide3">...</li>
  </ul>
  <div class="static-layer" class="logo">logo</div>
</div>

在你的 js 中你有类型 (.logo)，这意味着一个类是调用 logo。这可能是问题所在。祝你好运

【讨论】：

class="static-layer" class="logo" 真的吗？
有时在小窗口看到代码不好抱歉:D
你试过 setAttribute("class","white_logo") 吗？
我提到的是一个无效的标记。您不能两次拥有相同的属性。