GSAP+ScrollTrigger实现滚动到指定模块固定后滚动鼠标滑动元素 浏览器窗口向下向上滚动到指定模块后,模块固定,滚动鼠标实现该模块内的元素上下滑动。实现原理,在模块内添加一个固定显示元素和一个滑动元素,窗口滚动到它们的父元素时,一个元素固定显示,另一个元素通过滚动鼠标上下滑动。HTML代码:PS:GSAP自行下载。<!--gsap--> <script src="../js/gsap/gsap.min.js"></script> &... Web前端开发 / 2025-06-18 / 301次阅读
GSAP ScrollTrigger对多个相同class类名的元素独立应用滚动触发的动画效果 页面存在多个相同的模块,需要在滚动到各个模块的位置时独立触发该模块的动画效果,实现思路是使用 document.querySelectorAll 获取所有元素获取并通过 forEach 循环遍历元素,然后为每个元素单独创建动画和滚动触发器。示例:为所有 .box .name 元素添加「滚动到元素时淡入」的效果 Html 代码:<div class="box"> <div&nb... Web前端开发 / 2025-05-19 / 220次阅读