这是在 ScrollMagic 中初始化 'setPin' 方法的正确方法吗？

Question

我想知道以下代码对于以所需方式使用 ScrollMagic 是否正确。我正在尝试使用此方法固定元素，但它不起作用。

Javascript:

var controller = new ScrollMagic.Controller();

$('.caption, .backcap').each(function(){

var tween= TweenMax.from($(this), 1, {autoAlpha:0,x:'+=30'})


var scene = new ScrollMagic.Scene({
    triggerElement:(this)
})

.setPin()
.setTween(tween)
.addTo(controller);
});

HTML:

<div id="slide-1" class="slide">
<div id="pin" class="caption">
<div id="backcap" class="backcap"><div class="intro_text"><h1 class="uppercase">blender</h1></div></div>
<div id="backcap" class="backcap"><div class="intro_text"><p>3d art</p></div>
</div></div></div>

为了使其正常工作需要进行哪些更改？

Answer 1

您需要在 setPin() 方法中传递要固定的元素的 id 。

对于你的情况，这应该有效。

var scene = new ScrollMagic.Scene({
   triggerElement:(this)
}) 

   .setPin('#pin') 
   .setTween(tween)
   .addTo(controller);
});

这是在 ScrollMagic 中初始化 'setPin' 方法的正确方法吗？

Is this the correct way to initialize 'setPin' method in ScrollMagic?

javascript

scrollmagic