javascript - 如何将多个 setClassToggle（具有多个类）设置为同一个触发器 ScrollMagic

Question

我有这个代码：

// init
        var ctrl = new ScrollMagic.Controller();

        var videoArea;
        // return cached value
        function getVideoArea () {
            return videoArea;
        }
        // update value
        function updateVideoArea () {
            videoArea = $(window).height() + $("#start-anim2").height();
        }
        // update on resize
        $(window).on("resize", updateVideoArea);
        // set initial value
        updateVideoArea();

        // create scene
        var scene = new ScrollMagic.Scene({
            triggerElement: "#start-anim2",
            triggerHook: "onEnter",
            duration: getVideoArea
        })
        .on("enter", function(e) {
            console.log("start");
        })
        .on("leave", function(e) {
            console.log("stop");
        })
        .setClassToggle(".img-app-three:nth-child(2)", "active").addTo(ctrl);
        .setClassToggle(".img-app-three:nth-child(3)", "active").addTo(ctrl);
        .setClassToggle(".img-app-three:nth-child(4)", "active").addTo(ctrl);

我想补充

.setClassToggle(".img-app-three:nth-child(3)", "active").addTo(ctrl);
.setClassToggle(".img-app-three:nth-child(4)", "active").addTo(ctrl);

在与前面所示相同的代码中，因为我想要相同的触发器，但在不同的类上有多个“setClassToggle”。

我该怎么做？

谢谢大家。

标签： javascriptscrollmagic

Answer 1

你有没有尝试过

.setClassToggle(".img-app-three:nth-child(3), .img-app-three:nth-child(4)", "active").addTo(ctrl);

而不是一遍又一遍地调用相同的方法。