一款经典的jQuery kxbdMarquee 无缝滚动插件
<marquee> 曾是 IE 下独有的一个走马灯效果的标签,其他浏览器并不兼容,于是出现了使用 JavaScript 来模拟该效果的插件。
- 版本:
jQuery v1.3.2+
在线实例
实例预览 kxbdMarquee 模拟 Marquee 无缝滚动
使用方法
载入 JavaScript 文件
<script src="jquery.js"></script><script src="jquery.kxbdmarquee.js"></script>
CSS 样式
/*** 父容器需要设置溢出隐藏* 如果是水平滚动,项目需要设置浮动*/#element_id{overflow:hidden;}#element_id ul li{float:left;}
DOM 结构
<div id="element_id"><ul><li>...</li><li>...</li><li>...</li></ul></div>
JavaScript 调用方式
- $('#element_id').kxbdMarquee();
参数说明
| 名称 | 默认值 | 说明 |
|---|---|---|
| direction | "left" | 滚动方向。可设置为:"left", "right", "up", "down" |
| isEqual | true | 所有滚动的元素长宽是否相等。可设置为:true, false |
| loop | 0 | 循环滚动次数,0 表示无限循环 |
| scrollAmount | 1 | 步长(px) |
| scrollDelay | 20 | 时长(ms) |
一款经典的jQuery kxbdMarquee 无缝滚动插件的更多相关文章
- 精心挑选10款优秀的 jQuery 图片左右滚动插件
在现代的网页设计中,图片和内容滑块是一种极为常见和重要的元素.你可以从头开始编写自己的滑动效果,但是这将浪费很多时间,因为网络上已经有众多的优秀的 jQuery 滑块插件.当然,如果要从大量的 jQu ...
- jQuery kxbdMarquee 无缝滚动
转:http://code.ciaoca.com/jquery/kxbdmarquee/ <marquee> 曾是 IE 下独有的一个走马灯效果的标签,其他浏览器并不兼容,于是出现了使用 ...
- jquery图片无缝滚动代码左右 上下无缝滚动图片
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- liMarquee – jQuery无缝滚动插件(制作跑马灯效果)
liMarquee 是一款基于 jQuery 的无缝滚动插件,类似于 HTML 的 marquee 标签,但比 marquee 更强大.它可以应用于任何 Web 元素,包括文字.图像.表格.表单等元素 ...
- jQuery图片无缝滚动JS代码ul/li结构
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery图片无缝滚动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 利用jQuery无缝滚动插件liMarquee实现图片(链接)和文字(链接)向右无缝滚动(兼容ie7+)
像新闻类的版块经常要求一条条的新闻滚动出现,要实现这种效果,可以使用jQuery无缝滚动插件liMarquee. 注意: 1. 它的兼容性是IE7+,及现代浏览器. 2. 引用的jquery的版本最好 ...
- Infinite Scroll - jQuery & WP 无限滚动插件
无限滚动(Infinite Scroll)也称为自动分页.滚动分页和无限分页.常用在图片.文章或其它列表形式的网页中,用来在滚动网页的时候自动加载下一页的内容.Infinite Scroll 这款 ...
- 手写JS无缝滚动插件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
随机推荐
- iOS苹果企业证书被撤销以及启用与管理
在国内, 积分墙以及各大助手(爱思助手, 91苹果助手, XY苹果助手, PP助手, 快用助手)等业务领域都在使用,苹果对证书的使用越来越严格.简单的分析一下,证书被封的原因. 一般证书被封会收到 ...
- 深入理解CSS背景
前面的话 背景和字体一样,是一个复合属性,而且它是一个使用频率很高的属性.在CSS3中,背景属性在保持以前用法的同时,增加了新的相关属性.本文将详细介绍关于背景的知识 背景颜色 背景色backgrou ...
- office快速制作简历
毕业的一年是由学校向社会转变的一年,面临着人生的一个重大转折--找工作.在如今信息爆炸的时代,纵使力拔山兮气盖世也难免会被遗落芳草之中而不得一展宏图.对未来的憧憬,对美好生活的向往,或多或少你需要一份 ...
- 轻松自动化---selenium-webdriver(python) (十一)
本节重点: 控制滚动条到底部 有时候我们需要控制页面滚动条上的滚动条,但滚动条并非页面上的元素,这个时候就需要借助js是来进行操作.一般用到操作滚动条的会两个场景: 注册时的法律条文需要阅读,判断用户 ...
- JavaScript 回忆录
作者:禅楼望月(http://www.cnblogs.com/yaoyinglong) 1. 基本类型和应用类型 1.1 复制变量值的不同 值类型的变量在复制变量值后互不影响,因为值类型本身保存的就是 ...
- webpack打包压缩工具的使用方法
具体使用方法参考来源http://www.cnblogs.com/Leo_wl/p/4793722.html 必须注意的地方: 一.webpack在nodejs环境下运行 二,每个目录下都必须有一个w ...
- 高性能ORM 框架之 MySqlSugar
mysql 3.X API地址: http://www.cnblogs.com/sunkaixuan/p/5987308.html MySqlSugar 1.5 API 一.介简 SqlSugar ...
- Moon转告给你一个比Log4net更好日志框架--TracerX Logger 及其对应的日志查看器
一.介绍 TracerX logger是一个易于上手,且拥有众多高级特性的.NET日志框架. 它能够发送输出结果到多目的地(循环文件.事件日志等....).它也能生成文本和二进制文件.它拥有一个强大的 ...
- JavaScript DOM学习总结(二)
获取和设置属性 DOM实在是个好东西,掌握了它我们不仅可以在JavaScript中使用,其它程序语言我们同样可以使用. 接下来就一起使用DOM来干些实事吧! 1.getAttribute getAtt ...
- Objective-C语法简记
开始学习iPhone开发了,虽然现在已经有了Swift,但我还是老老实实地学习Objective-C,鄙人入门的程序语言是C,后来学习了C#和Java,现在来学Objective-C,这篇只是一些很简 ...