我在使用 GSAP 的 ScrollTrigger 時(shí)遇到問題。我在不同的視口寬度中設(shè)置了固定元素的高度,并且在調(diào)整窗口大小時(shí)效果很好。但現(xiàn)在我想通過單擊按鈕來更改固定元素的高度。我使用ScrollTrigger.refresh();但沒有任何反應(yīng)。有人可以告訴我如何修復(fù)它嗎?ScrollTrigger.create({ trigger: '.box', pin: true, start: 'top center', end: () => `+=${$('.h-500').height() - $('.box').height()}`, markers: true, id: "box", onRefreshInit: () => { }, onRefresh: () => { }});function resizeBox(){ $('.box').css('height', '50px'); ScrollTrigger.refresh();}body{ margin: 0;}.space { width: 100%;}.h-500 { height: 500px; background: yellow;}.h-1000 { height: 1000px;}.box { width: 100px; height: 100px; background: red;}button { position: fixed; top: 0; right: 0; z-index: 999; font-size: 20px;}@media only screen and (max-width: 600px) { .box { height: 5vw; }}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script src="https://unpkg.com/gsap@3/dist/ScrollTrigger.min.js"></script><script src="https://unpkg.co/gsap@3/dist/gsap.min.js"></script><div class="space h-1000"></div><div class="space h-500"> <div class="box"></div></div><div class="space h-1000"></div><button onclick="resizeBox()">resizeBox</button>
GSAP 3 ScrollTrigger 不適用于動(dòng)態(tài)變化的值(不刷新/重新計(jì)算)
慕娘9325324
2023-07-06 17:49:14