javascript 自动滚动的实时自动收报机(如 Twitter 的“热门推文”)

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3817214/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 02:22:06  来源:igfitidea点击:

An automatically scrolling live ticker (like the "Top Tweets" of Twitter)

javascriptjquerylisttwitterticker

提问by Zardoz

Is there a good Javascript library for generating an automatically scrolling list like the "Top Tweets" on the Twitter homepage? Preferable as jQuery plugin. It should also support AJAX functionality (to add new list items dynamically).

是否有一个很好的 Javascript 库来生成像 Twitter 主页上的“热门推文”这样的自动滚动列表?最好作为 jQuery 插件。它还应该支持 AJAX 功能(动态添加新的列表项)。

回答by Zardoz

As we were not really satisfied with the existing solutions we implemented one from scratch. Our solution is a fully jQuery UI compatible ticker plugin(also compatible with their theming framework) and fully unit tested. We didn't yet have the time to test it under every browser, so feedback is welcome (for problems please open issues on the below Github project site).

由于我们对现有解决方案并不真正满意,因此我们从头开始实施了一个。我们的解决方案是一个完全与 jQuery UI 兼容的股票代码插件(也与他们的主题框架兼容)并且经过了全面的单元测试。我们还没有时间在每个浏览器下测试它,所以欢迎反馈(如果有问题,请在下面的 Github 项目站点上打开问题)。

A special styled demo(Twitter like) is available here. The main main repository can be found here (tickerbranch). There are several options to customize the ticker (documentation at the above mentioned Github repository).

此处提供一个特殊样式的演示(类似于 Twitter)。主要的主存储库可以在这里找到股票代码分支)。有几个选项可以自定义股票代码(上述 Github 存储库中的文档)。

Screenshot:

截屏:

Ticker Screenshot

股票代码截图

回答by Zardoz

Here is a nice solution: Scrolling List

这是一个很好的解决方案:滚动列表

回答by Zardoz

That is the best solution I was able to find: Scrolling List

这是我能找到的最佳解决方案: 滚动列表

回答by Bojangles

If you want to write your own, make a divof fixed width/height, with overflow: hidden, then create another divinside it, with the position: relativeproperty, filled with content from your feed (twitter posts, or similar, etc). Then, when the page loads just make the inner div's top:CSS value change (if you want the list to scroll up, the topvalue should decrement from zero).

如果您想编写自己的,请使用div固定的宽度/高度,overflow: hidden然后div在其中创建另一个,使用该position: relative属性,填充来自您的提要(推特帖子或类似内容等)的内容。然后,当页面加载时,只更改innerdivtop:CSS 值(如果您希望列表向上滚动,则该top值应从零递减)。

I doubt this helps, but it is quite a good, simple way to get a scrolling without using a jQuery plugin.

我怀疑这会有所帮助,但这是一种无需使用 jQuery 插件即可进行滚动的非常好的简单方法。