gpt4 book ai didi

scroll - 自定义无限滚动,项目在滚动出 View 时被删除

转载 作者:行者123 更新时间:2023-12-03 20:30:42 26 4
gpt4 key购买 nike

问题

今天的现代网站可能会使用无限滚动技术来替换分页列表,从而为用户提供更加无缝的体验。

只要用户不向下滚动到很远的地方,这一切都很好而且很花哨,这意味着您的文档会因大量 DOM 节点而变得非常复杂。当然有一些方法可以缓解这个问题(例如,用一个合适高度的 DIV 替换顶部溢出的滚动元素),但它们要么实现起来很复杂,要么仍然有它们的缺陷。

想法

我在想是否有人已经看到了一个实现,其中滚动出(顶部或底部)的项目以某种方式变得更小和更暗,直到它们消失并被其相邻的项目取代。

我正在考虑以下经验的混合:

  • 滚动
  • 褪色
  • 缩放

  • 褪色和缩放​​可以在 Medium.com 上看到当您到达任何文章的底部并单击下面显示的下一个推荐文章时(单击标题)。当您点击时,如果您注意,您可以看到原始文章消失而被向上滑动的新文章所取代的效果。
    内容滚动可以通过这种方式完成,无限滚动会更顺畅,资源消耗更少,因为元素将被即时和就地替换。

    同时显示的项目数量当然取决于项目的大小。在中线文章的情况下,它可能是一篇也会滚动的文章,直到您将其滚动到最底部(或顶部)。对于像 Facebook 这样的帖子,它会同时包含更多的项目,因为它们不会占用太多的垂直空间。

    Coverflow 的工作方式有些相似,因为它完全显示中间内容,其余部分要么隐藏要么缩放/转换。

    问题

    有人在网上看到过这样的实现吗?如果做得好,它实际上会带来更好的无限滚动体验,而不会占用我们的浏览器。

    但为了使我的问题更加明确和无可争议。 您能否提供此类经验的有效示例(尽管已简化)?

    要求:
  • 当一个项目被滚出它会消失(使用淡入淡出/缩放/两者)
  • 当项目出现在底部(或向上滚动时的顶部)时,它们应该显示在与滚动出的项目相反的位置
  • 按通常的滚动按钮 Home、End、Page Up、Page Down 和 Space 应该可以工作。
  • 应该从 DOM 中删除不可见的项目
  • 滚动应该以某种方式使用某种滚动条以及
  • 最佳答案

    关于scroll - 自定义无限滚动,项目在滚动出 View 时被删除,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21296422/

    26 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com