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

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

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

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

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

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

1 个答案: