[转]jquery.vTicker(垂直滚动)
转至:http://www.w3ci.com/plugin/660.html
简介
vTicker 是一款非常小巧的 jQuery 垂直滚动插件,压缩后只有 2KB。vTicker 支持自定义滚动时间、间隔时间、显示个数、滚动方向(向上/向下)、容器高度等等,但它对 HTML 结构有点小“苛刻”——容器里面只能是 ul 标签。不过如果你仅仅是需要一个垂直滚动效果的话,vTicker 仍然是一个很好的选择,毕竟它是如此的小巧方便。
浏览器兼容
使用方法
1、引入文件
<script src="js/jquery.min.js"></script>
<script src="js/jquery.vticker.js"></script>
2、HTML
<div class="w3ci">
<ul>
<li>1、新闻标题</li>
<li>2、新闻标题</li>
<li>3、新闻标题</li>
<li>4、新闻标题</li>
<li>5、新闻标题</li>
<li>6、新闻标题</li>
<li>7、新闻标题</li>
<li>8、新闻标题</li>
</ul>
</div>
3、JavaScript
$('.w3ci').vTicker();
配置
属性/方法 类型 默认值 说明
speed 整数 700 每次滚动持续时间,单位为毫秒
pause 整数 4000 滚动间隔,单位为毫秒
showItems 整数 3 显示多少行
animation 字符串 ” 滚动动画,默认为空,可选 ‘fade’,既滚动时首位淡入淡出
mousePause 布尔值 true 鼠标悬停是否停止滚动
isPaused 布尔值 false 默认是否暂停
direction 字符串 ‘up’ 滚动方向,可选 ‘up’ / ‘down’
height 整数 0 容器高度,默认为 0,即根据 showItems 个数自动计算
[转]jquery.vTicker(垂直滚动)的更多相关文章
- 使用 jQuery.Pin 垂直滚动时固定导航
ZKEACMS的导航默认是不能固定的,随着页面的滚动而滚动,为了有更好的用户体验,当页面往下滚动时,可以将导航固定在顶端,这样方便用户点击. jQuery Pin 借助jQuery的一个插件 jQue ...
- 基于jquery的垂直滚动触发器,多参数可设置。
最近闲来无事,多封装些功能性组件.后期会有更多放出来,大家可以多关注一下. 先上参数: type:"show", 默认为“show”,“show”意为当能够在可 ...
- jQuery图片垂直滚动焦点图
在线演示 本地下载
- 自己写一个jQuery垂直滚动栏插件(panel)
html中原生的滚动栏比較难看,所以有些站点,会自己实现滚动栏,导航站点hao123在一个側栏中,就自己定义了垂直滚动栏,效果比較好看,截图例如以下: watermark/2/text/aHR0cDo ...
- jquery datatable设置垂直滚动后,表头(th)错位问题
jquery datatable设置垂直滚动后,表头(th)错位问题 问题描述: 我在datatable里设置:"scrollY": '300px',垂直滚动属性后,表头的宽度就会 ...
- JQuery的鼠标滚动事件
jQuery(window).height()代表了当前可见区域的大小,而jQuery(document).height()则代表了整个文档的高度,可视具体情况使用. 注意当浏览器窗口大小改变时(如最 ...
- jCarousel,jQuery下的滚动切换传送插件
转自:http://www.zhangxinxu.com/jq/jcarousel_zh/#Examples 介绍 jCarousel是一款 jQuery 插件, 用来控制水平或垂直排列的列表项. 这 ...
- js和jquery实现页面滚动监听
js和jquery实现页面滚动监听 一.总结 一句话总结:onscroll方法和监听页面元素的高度都可以实现滚动监听. 1.onscroll方法实现滚动监听的核心代码是什么? <body ons ...
- 基于jQuery实现页面滚动时顶部导航显示隐藏效果
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8& ...
随机推荐
- tinyXml在linux下的使用
[下载] 一.下载 xml 软件包:tinyxml_2_6_2.zipTinyxml(轻量级 c++)下载地址:http://sourceforge.net/projects/tinyxml/?sou ...
- HeadFirst设计模式之模板方法模式
一. 1.The Template Method defines the steps of an algorithm and allows subclasses to provide the impl ...
- Google Code Style
Google开源项目的代码遵循的规范,见这,C++, OC. PS: vim的配色编辑用户主目录下的.vimrc即可.
- j2se jndi
http://blog.csdn.net/lldwolf/article/details/2299622 正如你可以看到,从JNDI中检索对象是相当方便,简单.通过使用JNDI来存储配置信息,无状态对 ...
- 如何设置table的border-radius?
遇到一个诡异的问题, 为table添加border-radius不起作用. 示例如下: #table1 { border-collapse: collapse !important; border-r ...
- 功能齐全、效率一流的免费开源数据库导入导出工具(c#开发,支持SQL server、SQLite、ACCESS三种数据库),每月借此处理数据5G以上
软件名:DataPie 功能:支持SQL server.SQLite.ACCESS数据库的导入.导出.存储过程调用,支持EXCEL2007.EXCEL2003.ACCESS2007. CSV文件导入数 ...
- 锋利的JQuery-Jquery中DOM操作
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- *gravity的取值详表
android有 android:layout_gravity 和 android:gravity,前者设置相对父控件布局,后者是设置自己内部的控件的布局. Value Description top ...
- poj 2676 Sudoku ( dfs )
dfs 用的还是不行啊,做题还是得看别人的博客!!! 题目:http://poj.org/problem?id=2676 题意:把一个9行9列的网格,再细分为9个3*3的子网格,要求每行.每列.每个子 ...
- Innodb物理存储结构系列1
本篇先介绍 下Innodb表空间,文件相关的内存数据结构. 1. 数据结构 Innodb的tablespace和文件的关系,是一对多的关系,先来看三个结构体 1. fil_system_struct: ...