一个jQuery的即时新闻行情展示插件jQuery News Ticker

时间:2021-09-16 08:57:33

今天分享一个新闻行情的jQUery插件,可以帮助大家使用比较小的页面区域来展示最新最重要的信息。

一个jQuery的即时新闻行情展示插件jQuery News Ticker

在线演示

jQuery news ticker是一个非常方便的jQuery插件,能够快速让你生成这样的一个新闻行情效果。

它能够通过列表,HTML甚至是RSS(只能加载本站的RSS feed)来生成新闻内容,并且支持前后播放和停止。这个插件支持一系列的自定义选项,例如:

  • 播放速度
  • 播放效果
  • 播放方向
  • 显示时间

代码开发简单高效。

首先引入jQuery news ticker类库及其jQuery类库:

<link href="css/ticker-style.css" rel="stylesheet" type="text/css" />
<script src="jquery.ticker.js" type="text/javascript"></script>

HTML代码:

<div id="ticker-wrapper" class="no-js">
    <ul id="js-news" class="js-hidden">
        <li class="news-item"><a href="#">This is the 1st latest news item.</a></li>
        <li class="news-item"><a href="#">This is the 2nd latest news item.</a></li>
        <li class="news-item"><a href="#">This is the 3rd latest news item.</a></li>
        <li class="news-item"><a href="#">This is the 4th latest news item.</a></li>
    </ul>
</div>

javascript:

<script type="text/javascript">
    $(function () {
        $('#js-news').ticker();
    });
</script>

原文来自: GBin1推荐:一个jQuery的即时新闻行情展示插件jQuery News Ticker