jQuery News Ticker 基于jQuery的即时新闻行情展示插件_jquery

效果图:

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>

官方网站 http://www.gbin1.com/technology/jquerynews/20111105jquerypluginnewsticker/demo.html
相关文件下载

时间: 2024-09-23 20:03:14

jQuery News Ticker 基于jQuery的即时新闻行情展示插件_jquery的相关文章

jQuery UI Tabs 基于 jQuery 的一个Tab选项卡导航,如何保存选项卡的选中状态

问题描述 jQueryUITabs基于jQuery的一个Tab选项卡导航,如何保存选项卡的选中状态比方我在TABS-2中的保存按钮中保存后,怎么将选项卡还是选中TABS-2呢? 解决方案 解决方案二:为你的TABS-2里的<a>命名一个id然后通过脚本设置aID.click()解决方案三:这个还真的不好说,页面保存数据几乎不能,我觉得还是借用xml或者其他存储数据的工具来保存,用到的时候再取出来就可以了解决方案四:引用1楼sandy945的回复: 为你的TABS-2里的<a>命名一

基于jQuery的淡入淡出可自动切换的幻灯插件_jquery

其实就是一个幻灯效果,考虑到使用方便,就封装成一个插件了. 插件特点 1. 参数高度自定义; 2. 可重复调用且与不影响; 3. 插件文件小,压缩后仅1.04k,开发版3.29k. 演示及下载  使用方法 1. 引入jQuery库文件及jQuery.iFadeSlide.pack.js插件文件(若页面有其他js文件,可与之合并以减小http请求),引入位置自定义; 复制代码 代码如下: <script src="http://ajax.googleapis.com/ajax/libs/jq

【jQuery教程】基于JQuery框架的AJAX

前几天发了个贴,分享了prototype框架关于AJAX方面的学习过程.然后有人说jquery框架更方便. 正好项目中准备使用thickbox,于是干脆抛弃prototype.js,看起jquery.js了.JQuery确实不错,体积比 Prototype小了许多,而且使用起来更方便更灵活.有人说Prototype像JAVA,正统:而JQuery像Ruby,灵活,更趋于OOP. 小试了下AJAX,感觉比prototype简洁多了,在JQuery中,AJAX有三种实现方式:$.ajax(),$.p

jQuery实现带水平滑杆的焦点图动画插件_jquery

这是一款很实用的jQuery焦点图动画插件,跟其他jQuery焦点图插件不同的是,它带有一个水平的滑杆,你可以通过滑动滑杆实现图片的切换,也可以通过点击图片来切换.这款焦点图是纯jQuery实现的,兼容性和实用性都还可以,而且也比较简单,很容易集成到需要的项目中去. 效果展示如下所示:   HTML代码 <div id="wrapper"> <ul id="flip"> <li title="The first image&q

jquery.Jwin.js 基于jquery的弹出层插件代码_jquery

代码如下: 复制代码 代码如下: (function ($) { var imgdir = 'images/';//图片文件夹路径 var autoHide=false;//悬浮div是否自动隐藏 var hideType='hide';//隐藏的方式 可选参数 hide.slide.fade var hideDelay=0;//悬浮div隐藏过程使用的时间 var hideTime=0;//悬浮div延迟隐藏时间 var zIndex=100;//多个div时获取焦点的div处于顶层 var

jquery.cvtooltip.js 基于jquery的气泡提示插件_jquery

序 1.插件名cvtooltip中的cv是ChinaValue的首字母缩写,而tooltip就是提示啦. 2.适用于新功能的提示,引导用户的提示,即时类消息的提示,操作失败提示(操作成功了也没人拦着)等等等,使用css实现,不附带任何图片文件. 3.目前发现的问题,在Chorme中表现的不给力,是由于Chrome对页面的解析与IE和FF不同,导致jquery的position或者offset返回值不同. 4.该插件依然是练习之作,一人之力,错误难免. 实例演示 1.载入页面的同时,气泡提示也显示

EasySlider 基于jQuery功能强大简单易用的滑动门插件_jquery

Easy Slider 是一个滑动门插件,支持任何图片或内容,当点击时实现横向或纵向滑动.它拥有一系列丰富的参数设置,可通过CSS来进行完全的控制.所以,基本上你只需要链接这个插件文件后,设置好内容,然后样式化CSS就可以了.EasySlider的功能 支持横向或纵向滑动 支持自动滚动 支持连续滑动 "上一屏"和"下一屏按钮" "到第一屏"和"最后一屏"按钮 隐藏的控制 可选的控制按钮包围标记 同一页面可支持多个滑动门 可设置

jQuery EasyUI一个基于 jQuery 的框架(创建网页所需的一切)

jQuery EasyUI学习网址:http://www.runoob.com/jeasyui/jqueryeasyui-tutorial.html jQuery MiniUI学习网址:http://www.miniui.com/index.html#tutorial easyui 的入门学习:http://www.cnblogs.com/biehongli/p/6724953.html 一:jQuery EasyUI的入门指南: 1:实现的方法一 (a):导入jquery.easyui.min

基于jQuery的可用于选项卡及幻灯的切换插件_jquery

思路就不说了,记得以前写过一个自动切换的幻灯插件:,思路有部分是类似的.当然,本文中插件源码中也有注释~ 插件核心代码:点此查看演示 复制代码 代码如下: $.fn.WIT_SetTab=function(iSet){ /* * @Mr.Think * Nav: 导航钩子: * Field:切换区域 * K:初始化索引: * CurCls:高亮样式: * Auto:是否自动切换: * AutoTime:自动切换时间: * OutTime:淡入时间: * InTime:淡出时间: * CrossT