ScrollTrigger - if pinned ?

[TELLO]

Hi all,

 

how can I get in other function if the ST navi_second is pinned or not?

 

ST

gsap.to(navi, {
  scrollTrigger: {
    trigger: navi_second,
    endTrigger: "",
    end: () => "+=" +
      $(document).height(),
    pin: true,
    pinSpacing: false,
    onEnter: () => tl_navi_mini_ani.play(),
    onLeaveBack: () => tl_navi_mini_ani.reverse()
  }
})

 

Here I need if pinned or not:

$(navi_second).on("mouseenter", function () {
  console.log(navi_second.ispinned_or_not)
});

 

THX for help

TELLO

[TELLO]

Ok - I found a solution myself. I add a ID to the ScrollTrigger and I ask for isActive.

Works for me....

[ZachSaucier]

That's a good solution. You could also save the tween to a variable and check if that reference is active or something like that. Or set some variable in the onEnter/onLeaveBack and set it to the opposite in the onLeave/onEnterBack.

[TELLO]

@ZachSaucier by the way...

To add a var was my first idea. But I was not able to do this. 

How can I add this additional to my line, where I have my function already?

 

onEnter: () => tl_navi_mini_ani.play(), myvar = true, 

 

[ZachSaucier]

1 minute ago, TELLO said:

How can I add this additional to my line, where I have my function already?

 

onEnter: () => tl_navi_mini_ani.play(), myvar = true, 

You have a few options.

 

You could either use a more conventional function like so:

onEnter: function() {
  tl_navi_mini_ani.play();
  myvar = true;
}

Or do the same sort of thing with your inline function:

onEnter: () => {
  tl_navi_mini_ani.play();
  myvar = true;
}

Or technically you use &&, though this is error prone because values could be falsy and it doesn't look good:

onEnter: () => tl_navi_mini_ani.play() && myvar = true,

 

[TELLO]

THX!