0

现场演示

我的 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>

编辑：所以我想将任何“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 插件 * @version：4.6.4 (26.11.2014)

4

1 回答 1

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

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

于 2015-10-30T06:41:41.433 回答