【问题标题】:DIV with Circular Scrolling带循环滚动的 DIV
【发布时间】:2012-02-24 22:23:00
【问题描述】:

我正在尝试创建一个带有循环滚动的 DIV。 Here is an example 类似于我想要实现的目标。就我而言,DIV 包含一系列图像。 Here is a demo, sans Javascript.

我的目标是让 DIV 执行以下操作:

  • 如果滚动到 DIV 的底部,滚动会从头开始重新开始,给人一种循环滚动的印象
  • 如果滚动到顶部,反之亦然

我不认为简单地从顶部跳到底部可以实现。由于内容不同(与the example I gave above 不同),用户会看到 DIV 正在跳跃。我也对一次跳过一张图像的轮播插件不感兴趣。我的目标是让 DIV 表现得像标准 DIV,溢出设置为滚动,只有滚动是循环的。

是否有任何已经存在的插件可以做到这一点?

【问题讨论】:

  • 我不确定是什么让您认为滚动与正常情况有任何不同。看起来您正在查看由对角线创建的“拐杖糖效果”。
  • 您是否注意到页面有几英里长?它从中心开始?当它到达底部时,它会跳回顶部(反之亦然)?就这么简单,何必复杂呢?
  • @GoldenNewby 如果您使用鼠标滚轮滚动页面,最终页面会从上到下移动(反之亦然),您可以无限滚动。看起来页面的顶部/底部使用了完全相同的照片,因此当您点击其中一张或另一张时,页面会跳转到顶部/底部,因此您不会真正注意到它,并且感觉就像是不断滚动。如果拖动滚动条,由于拖动限制,它不会产生相同的效果。概率。在触摸屏上效果很好。
  • @Joseph 它更复杂,因为我给出的示例中的内容是平铺的。我的内容不是。
  • @colindunnn 倾斜是背景和内容的错觉。尝试不时查看一下源代码,发现有很多部分,绝对定位,定位到它们看起来像是倾斜的,与带有倾斜的背景图像一致。

标签: javascript jquery html


【解决方案1】:

插件http://ianli.com/infinitedrag/ 几乎完全符合您的要求。它甚至还有一个“轴”,只允许它上下滚动,而不是像你的第一个示例链接那样滚动。

【讨论】:

  • 这看起来很有希望!一旦我有机会玩它,我会回来检查的。谢谢。
  • 嗯,仔细观察,它似乎并不是我想要的。还是谢谢。
  • 您能否进一步解释一下为什么 Infinite Drag 不能满足您的需求?
猜你喜欢
  • 1970-01-01
  • 2012-05-13
  • 1970-01-01
  • 2015-08-20
  • 2021-09-24
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多