如何捕获 facebook 画布框架内的滚动事件？

发布于 2024-12-08 11:40:47 字数 188 浏览 0 评论 0原文

我试图捕捉用户何时滚动 facebook 应用程序的画布 iframe。我尝试过：

$(window).scroll(...)
$(document).scroll(...)
$(parent).scroll(...)
$(parent.document).scroll(...)

但它不着火。

原文

I am trying to catch when a user scrolls canvas iframe of facebook app. I tried:

$(window).scroll(...)
$(document).scroll(...)
$(parent).scroll(...)
$(parent.document).scroll(...)

but it doesn't fire.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

时光与爱终年不遇 2024-12-15 11:40:47

我认为你的意思是当用户滚动主页而不是 iframe 时捕获，对吗？

您不能直接执行此操作，您必须使用 FB.Canvas.getPageInfo，如 http://developers.facebook.com/docs/reference/javascript/FB.Canvas.getPageInfo/ 。您无法将其作为事件“捕获”，但您可以使用 setInterval 或类似方法轮询滚动值以检测页面位置何时发生更改。

回复收藏 0 原文

勿忘初心 2024-12-15 11:40:47

正如 @Floyd 所说，滚动事件不会触发（假设您隐藏 iframe 滚动条），因为您的应用程序位于 Facebook 内部的 iframe 中。

您可以使用 FB.Canvas.getPageInfo 检测用户在页面上的滚动位置（Facebook，而不是您的应用程序 - 因此除非您考虑标题和浮动标题，否则它不会完全准确） http://developers.facebook.com/docs/reference/javascript/ FB.Canvas.getPageInfo/ 但是当您想要检查用户滚动位置时，您必须轮询该事件，因此您可以使用 setInterval 在计时器上设置它。

我刚刚为此目的创建了一个插件，以便在我的一个 Facebook 应用程序中使用。要使用它，您只需在 window.fbAsyncInit 函数之后、加载 Facebook Javascript SDK 之前包含该插件即可。

您可以订阅 Facebook 事件“scroll”或监听 dom 事件“fb-scroll”，这两个参数将传递“topPercent”和“bottomPercent”，然后根据用户滚动位置调用您自己的函数。

https://github.com/kus/facebook-app-scroll-event

例子：

// Subscribe to custom Facebook event
FB.Event.subscribe('scroll', function(topPercent, bottomPercent){
    console.log('scroll', topPercent, bottomPercent);
});

// Listen to dom event with jQuery
jQuery(document).on('fb-scroll', function(evt, topPercent, bottomPercent){
    if(bottomPercent == 100){
        // load more content
    }
});

As @Floyd said the scroll events will not fire (assuming you are hiding the iframe scrollbars) as your App is in an iframe inside of Facebook.

You can detect the users scroll position on the page (Facebook, not your app - so it won't be completely accurate unless you take the header and floating header into account) by using FB.Canvas.getPageInfo http://developers.facebook.com/docs/reference/javascript/FB.Canvas.getPageInfo/ but you have to poll the event when ever you want to check the users scroll position, so you could set it up on a timer with setInterval.

I just created a plugin for this purpose to use in one of my Facebook apps. To use it all you simply do is include the plugin after your window.fbAsyncInit function and before you load the Facebook Javascript SDK.

You can subscribe to the Facebook event "scroll" or listen to the dom event "fb-scroll" which two parameters will be passed "topPercent" and "bottomPercent" and then call your own functions based on the users scroll position.

https://github.com/kus/facebook-app-scroll-event

Example:

// Subscribe to custom Facebook event
FB.Event.subscribe('scroll', function(topPercent, bottomPercent){
    console.log('scroll', topPercent, bottomPercent);
});

// Listen to dom event with jQuery
jQuery(document).on('fb-scroll', function(evt, topPercent, bottomPercent){
    if(bottomPercent == 100){
        // load more content
    }
});

回复收藏 0 原文