Facebook Canvas IFRAME 需要获取父页面的 ScrollTop() 值
我会立即声明，我知道由于安全限制，这是不可能的，但这是我的场景，我正在寻找一些我可能没有的创造性解决方法经过考虑的。
我有一个显示图像缩略图的网站。当用户单击缩略图时，我使用 jQuery 覆盖控件 (FaceBox) 在弹出窗口中显示全尺寸图像。弹出窗口的顶部始终距离页面顶部 20 像素，因此需要读取页面的scrollTop() 值。
当我直接访问我的网站时，此功能非常有用。但是，当我从 IFRAME 中的 Facebook Canvas 应用程序加载网站时，我的弹出窗口定位代码就会中断。我已关闭 Canvas 的滚动条，并使用 FB.Canvas.setSize(...) 手动通知父页面 IFRAME 中的高度变化。由于不允许我访问父级中的 ScrollTop() 值，因此我的解决方法是将覆盖层的顶部相对于源缩略图的顶部定位。这可以使叠加层靠近源，但这并不理想，特别是当缩略图靠近视口底部时。
有什么方法可以将弹出窗口定位在距 IFRAME 顶部 20 像素的位置，但以某种方式考虑到父窗口的（禁止的）ScrollTop() 位置？
这似乎是一个相当常见的场景；我希望 Facebook 未来有计划解决这个问题。 FB.Canvas.getPageInfo 对象看起来是一个很好的候选对象。它有一个scrollTop 成员，但它用于Canvas，而不是父框架，如果滚动条关闭，则该值始终为零。
I'll state right away I know this isn't possible due to security restrictions, but here's my scenario and I'm looking for some creative workarounds that I may not have considered.
I have a web site that displays thumbnails of images. When users click on the thumbnails, I use a jQuery overlay control (FaceBox) to display the full-sized image in a popup. The top of the popup window is always positioned 20 pixels from the top of the page, so it needs to read the scrollTop() value of the page.
This feature works great when I access my site directly. But when I load the site from a Facebook Canvas Application in an IFRAME, my positioning code for the popup breaks. I have turned off scroll bars for the Canvas and am using FB.Canvas.setSize(...) to manually notify the parent page of height changes in my IFRAME. Since I'm not allowed to access the ScrollTop() value in the parent, my workaround has been to position the top of the overlay relative to the top of the source thumbnail. This keeps the overlay close to the source, but it's hardly ideal, especially if the thumbnail is close to the bottom of the viewport.
Is there any way that I can position the popup 20 pixels from the top of the IFRAME but somehow take into account the (forbidden) ScrollTop() location of the parent window?
This seems like a fairly common scenario; I hope that Facebook has plans to address this in the future. The FB.Canvas.getPageInfo object looks like a good candidate for this. It has a scrollTop member, but it's for the Canvas, not the parent frame, and if scroll bars are turned off, this value is always zero.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
因此，事实证明，本机 FB.Canvas.getPageInfo() 方法完全符合我一直希望它执行的操作。我添加了一些代码来从我的 Facebook 应用程序 (http://apps.facebook.com/ipredikt) 中秘密调用它返回了我需要正确定位弹出窗口和覆盖层的值。下次我们将新位推送到 Azure 时，我将更新定位代码以考虑 FB.Canvas.getPageInfo() 中的值。
So, it turns out that the native FB.Canvas.getPageInfo() method does exactly what I wanted it to do all along. I added some code to secretly invoke this from within my Facebook app (http://apps.facebook.com/ipredikt) and it returned the values I need to properly position popups and overlays. The next time we push new bits to Azure, I'll update my positioning code to take into account value from FB.Canvas.getPageInfo().