在 framer scrollComponent 上监听滚动

Listen for scroll on framer scrollComponent

我正在尝试检查 deltaY in framer 滚动事件并仅在 deltaY == 0.

时执行函数

framer(用 coffeescript 编写)似乎没有办法对此进行检查。还有另一种说法(伪代码):

if the change of the Y scrolling has been zero for 30 frames, execute function

framer scroll 事件有这个方法:

scrollComp.isMoving

在这个页面上发现: https://framer.com/docs/#scroll.scrollcomponent

但是如果我尝试这样做,语句的其他部分不会打印任何内容

if scrollComp.isMoving
    print 'moving'
else if scrollComp.isMoving == false
    print 'stopped'

///或者这也不起作用:

if scrollComp.isMoving
    print 'moving'
else 
    print 'stopped'

== 的 Coffeescript 等价物是 is,实际上等价于 ===(检查值和类型)。

话虽如此,if scrollComp.isMoving == false 说起来有点尴尬,在 JS 中说 unless scrollComp.isMovingif(!scrollComp.isMoving) 更有意义。

好的,为了解决您的问题(我认为以上两件事都不会真正解决),当您执行这些 print 语句时,您很可能正在这样做当脚本启动而不是在事件处理程序中异步执行时。当您的页面加载时,就是您的代码输入 if/else 语句时,此时您没有滚动,因此将始终为 false。要捕获滚动的瞬间,并在滚动发生时编写 运行 代码,您需要注册一个事件侦听器:

scrollComp.onMove ->
  // Scrolling here! Do fancy stuff!
  print scrollComp.isMoving     // 'true'

现在,为了能够在滚动停止后 30 秒触发函数调用,我们必须跟踪时间:

// Define interval as 30 seconds.
// (expressed in milliseconds)
interval = 30*1000
time = Date.now() // set timer to now

scrollComp.onMove ->
  // We update the timer every time
  // scroller moves.
  time = Date.now()

// We need to create an infinite loop
// that will check the time since last 
// move of the scroller, and execute
// a function when the time has surpassed
// some threshold.
setInterval ->
  if (Date.now() - time) > interval
    // It has been 30 seconds since
    // scroller last moved.
, 5000 

最后一个 5000 数字就是 运行 时间检查的频率;这将 运行 每 5000 毫秒。

如果你真的想计算帧数,你可以通过 calculating the frame rate 动态生成 interval 变量并使用一些代数柔术。