Javascript 确定用户在页面上的位置
当您在 Gmail 中查看长线程时,屏幕底部会出现一个 div,显示下一条消息的作者姓名。当您滚动并查看更多消息时,此 div 会更新,并且始终显示消息作者的姓名(位于您正在查看的消息之后)。
您认为这个功能是如何实现的?
我有一个包含日志信息的长页面,我想提醒用户他们在页面上的位置。我尝试查看 gmail javascript,但代码太混乱,无法理解。
When you view a long thread in gmail a div appears at the bottom of the screen showing the name of the author of the next message. As you scroll and view more messages this div gets updated, always with the name of the author of the message which is after the message you are viewing.
How do you think this feature is implemented?
I have a long page with log information and I'd like to remind the user where they are on the page. I've tried looking at the gmail javascript, but the code is too obfuscated to follow.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
您需要获取当前的滚动偏移量。这决定了用户在页面下方的位置。
您需要知道这个偏移量处是什么元素。元素的位置是使用每个父元素之间的偏移量来计算的。
通常,JQuery、MooTools、YUI 等库都有现有的方法来获取滚动位置和元素位置。
You need to get the current scroll offset. That determines how far down the page the user is.
You need to know what element is at this offset. The position of elements is calculated using their offset of each parent element from each other.
Usually, a library such as JQuery, MooTools, YUI etc. have existing methods to get scroll position and element positions.
使用 jQuery,您可以获取所有内容的高度,然后根据当前滚动位置以这种方式计算。
或者,您可以让他们需要“单击”他们正在查看的内容,然后通过
onfocus
进行操作。Using jQuery you could get the height of everything, and then calculate it this way, based on the current scroll position.
Alternatively, you could make it such that they need to 'click' on the thing they are looking at, and then do it via
onfocus
.