微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
最近更新
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程
自媒体 新闻
首页 > web前端 > js教程 > 正文

jquery实现文字由下到上循环滚动的实例代码_jquery

php中文网
发布： 2016-05-16 17:26:12
原创
1389人浏览过

有如下代码：

复制代码 代码如下:



  • 第1个li元素

  • 第2个li元素

  • 第3个li元素

  • 第4个li元素

  • 第5个li元素

  • 第6个li元素

  • 第7个li元素

  • 第8个li元素


但是页面只显示前5个li(相关css不做赘述)，想要循环显示li里面的内容就是在制定的时间将ul向上移动li的高度，于此同时将第一个li加到ul中li的末尾。
　　代码如下：

MagicStudio
MagicStudio

图片处理必备效率神器！为你的图片提供神奇魔法

MagicStudio 102
查看详情 MagicStudio
复制代码 代码如下:

function autoScroll(obj, ul_bz){
$(obj).find(ul_bz).animate({
marginTop : "-25px"
},500,function(){
$(this).css({marginTop : "0px"}).find("li:first").appendTo(this);
});
}
setInterval('autoScroll("#oDiv", "#oUl")',3000)
相关标签：
jquery

大家都在看：

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。

下载
来源：php中文网
收藏 点赞
上一篇：判断是否安装flash player及当前版本的JS代码_javascript技巧 下一篇：js 为label标签和div标签赋值的方法_javascript技巧
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
最新问题
JavaScript性能监控_关键指标采集与分析系统 首先明确JavaScript性能监控系统需聚焦核心指标采集与分析。从首屏JS加载时间、长任务检测、函数执行耗时、内存使用情况到错误异常捕获，全面收集运行数据；通过navigator.sendBeacon上报，结合聚合采样与分类标记策略，将数据存入时序数据库或日志系统；服务端计算分位数、对比版本差异、设置阈值告警，并关联用户行为分析瓶颈；最终在CI/CD中集成基线检查，定期生成报告，推动专项优化，形成“采集→上报→分析→优化”闭环，确保数据可读、可追溯、可行动。
2025-11-21 17:33:07
430
JavaScript_依赖管理与版本控制 答案：JavaScript项目依赖管理需合理使用package.json分类依赖，遵循SemVer版本规范，通过^~符号控制更新范围，提交package-lock.json确保环境一致，并定期执行npmoutdated、npmaudit进行更新与安全检查，保障项目稳定可维护。
2025-11-21 17:31:33
275
解决Flask AJAX文件上传中request.files为空的问题 本文详细阐述了在Flask应用中通过AJAX进行文件上传时，request.files对象为空的常见问题及解决方案。核心在于正确地将文件对象添加到FormData，并配置jQueryAJAX请求的contentType和processData参数为false，以确保文件数据能正确发送至服务器端，从而实现高效稳定的文件上传功能。
2025-11-21 17:29:22
867
JavaScript动态管理CSS：获取与修改CSSStyleSheet规则 本教程旨在指导开发者如何正确地通过JavaScript访问和修改网页的CSSStyleSheet对象及其内部的CSS规则。我们将探讨直接通过DOMAPIdocument.styleSheets获取样式表的方法，而非通过网络请求CSS文件，并详细演示如何遍历cssRules来读取或修改样式定义，从而实现动态样式调整，尤其适用于浏览器扩展开发场景。
2025-11-21 17:29:01
559
WordPress Contact Form 7 条件重定向与安全集成实践 本教程探讨WordPressContactForm7表单提交后的条件重定向需求，特别是在处理敏感数据或支付集成时的挑战。文章强调了自定义JavaScript重定向可能带来的安全和合规风险，并强烈建议在涉及Stripe等支付服务时，优先选择经过充分测试和验证的第三方插件解决方案，以确保数据安全、简化PCI合规性并降低开发与维护成本。
2025-11-21 17:21:25
507
深入理解LeetCode 1038：将二叉搜索树转换为累加树 本文详细解析了如何将二叉搜索树（BST）转换为累加树（GreaterTree），即每个节点的值更新为原节点值加上所有大于或等于该节点值的总和。核心算法利用了二叉搜索树的特性，通过反向中序遍历（右-根-左）结合累加和，以递归方式高效地完成转换，并重点阐释了递归调用中累加值传递的机制。
2025-11-21 17:21:06
707
掌握CSS样式表：在Web页面和Chrome扩展中高效访问与修改样式规则 本教程旨在指导开发者如何在Web页面和Chrome扩展中正确访问和修改CSS样式表。文章将深入探讨使用document.styleSheetsAPI来获取页面加载的样式表对象，并详细介绍如何遍历cssRules以读取和修改CSS规则，特别是针对CSS变量的操作，避免直接fetchCSS文件导致的常见误区。
2025-11-21 17:14:12
286
JavaScript日期库_日期计算最佳实践 选对日期库如date-fns或Day.js，规范输入输出格式，避免原生Date陷阱，统一使用标准解析与格式化方法，可有效减少JavaScript中日期处理的bug。
2025-11-21 17:07:23
353
自定义按钮触发原生颜色选择器：利用实现UI优化 本教程详细阐述了如何通过自定义按钮或图标触发HTML原生颜色选择器，同时隐藏默认的输入框，以实现更美观的用户界面。核心方法是利用元素与的关联性，结合CSS隐藏输入框，从而在点击自定义UI元素时直接唤起颜色选择器，无需JavaScript。
2025-11-21 17:07:00
401
路由管理：History API与Hash路由 前端路由主要有Hash和History两种模式。1.Hash路由利用URL中#后的部分，兼容性好、无需后端配置，适合静态服务器部署，但URL不美观且SEO较差；2.HistoryAPI路由通过pushState和popstate实现无刷新更新URL，URL简洁利于SEO，需后端支持返回入口文件。选择依据为：若需兼容旧浏览器或静态部署，选Hash模式；若追求良好用户体验和专业URL结构且可配置服务器，则选History模式。现代框架如VueRouter、ReactRouter均支持两者，可根据场景
2025-11-21 17:07:02
449
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部