最佳JavaScript和jQuery Marquee(News Ticker)插件

本文概述

• 5. jQuery Ticker
• 4. jQuery Easy Ticker
• 3. jQuery News Ticker
• 2. Marquee3000
• 1. jQuery Marquee
• Simple Marquee

并非所有开发人员都知道HTML的字幕标记, 它使你可以创建滚动显示的文本或图像, 该文本在DOM上水平或垂直显示。它具有功能, 但是此标记已过时, 因此你应避免使用它。解决此问题的最可靠替代方法是使用纯JavaScript(或本例中的插件)。

如果你需要使用新闻自动收录器样式实现字幕, 我们收集了5个最好的jQuery插件, 这些插件将帮助你实现目标。

5. jQuery Ticker

jQuery Ticker是一个轻量级的jQuery插件, 用于为简单的新闻动态器设置动画。为代码容器添加一个HTML标记(例如div或span), 其中包含一个包含代码项的无序列表。其他内容也可能在置顶容器内。股票行情标题(li标签)可能包含以下基本HTML标签：<a>, <b>, <strong>, <i>, <em>, <u>和<span>：

<div class="ticker">
    <strong>News:</strong>
    <ul>
        <li>Ticker item #1</li>
        <li>Ticker item #2</li>
        <li><em>Another</em> ticker item</li>
        ...
    </ul>
</div>

并初始化：

$('.ticker').ticker();

4. jQuery Easy Ticker

Github

jQuery easy ticker是类似于插件的新闻行情, 可无限滚动列表。它是高度可定制的, 具有许多功能的灵活性, 并且可以在所有浏览器中使用。该插件的主要功能是：

• 有两个方向可用(上下)。
• 可以针对任何模板。
• 灵活的API, 可扩展到各种应用程序。
• 支持”缓动”功能。
• 鼠标暂停功能可用。
• 转换速度可以更改。
• 可以按顺序添加控件以播放/暂停或上下移动列表。
• 跨浏览器支持。
• 轻量级(4 Kb-完整源/ 2.7 Kb-缩小源)。

3. jQuery News Ticker

Github

BBC新闻页面代码(http://news.bbc.co.uk)风格简单易用, 灵活灵活的新闻代码。仅建议用于jQuery 1.4.x或更高版本(网站上提供了支持jQuery 1.3.2的早期版本, 但缺少某些功能, 不再受支持)。首先, 下载包含插件和新闻资讯示例/文档的zip文件。

2. Marquee3000

演示版

Marquees是一个无依赖的超级流畅, 通用的javaScript插件。该插件是完全免费的。 marquee3000的主要功能是：

• 缩小〜3kb, 无依赖性
• 将任何元素变成黄油状的选取框
• 文字, 图片++ *就可以了
• 与CSS一样, 样式选取框-发挥创意！
• 设定速度和方向
• 一吨无任何减速
• 反应灵敏！

1. jQuery Marquee

jQuery Marquee是一个5.51 KB(最小化)的jQuery插件, 用于像旧的传统字幕一样滚动文本。这个插件将检测浏览器是否支持CSS3动画, 而不是使用CSS3为元素设置动画, 这比使用jQuery动画要好得多。

Simple Marquee

一个易于实现的选框JQuery插件, 具有悬停支持。

如果你知道另一个开源Marquee插件, 请在评论框中与社区共享。