jQuery实现简单的间隔向上滚动效果


Posted in Javascript onMarch 09, 2015

本文实例讲述了jQuery实现简单的间隔向上滚动效果的方法。分享给大家供大家参考。具体实现方法如下:

<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>

<div id="broadcast" class="bar" name="giftactive">

 <div style="float:left"><strong>间隔滚动效果:</strong></div>

 <div id="demo" style="overflow:hidden;height:22px;line-height:22px;">

     <ul class="mingdan" id="holder">

  <li><a href="#" target="_blank">aaaaaa</a></li>

  <li><a href="#" target="_blank">bbbbbb</a></li>

  <li><a href="#" target="_blank">cccccc</a></li>

  <li><a href="#" target="_blank">dddddd</a></li>

  <li><a href="#" target="_blank">eeeeee</a></li>

     </ul>

 </div>

</div>

<script type="text/javascript">

function AutoScroll(obj) {

 $(obj).find("ul:first").animate({

 marginTop: "-22px"

 }, 500, function() {

 $(this).css({ marginTop: "0px" }).find("li:first").appendTo(this);

 });

 }

 $(document).ready(function() {

 setInterval('AutoScroll("#demo")', 1000)

 });

</script>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript高级程序设计 DOM学习笔记
Sep 10 Javascript
AngularJS在IE8的不支持的解决方法
May 13 Javascript
DropDownList实现可输入可选择(两种版本可选)
Dec 07 Javascript
微信小程序 天气预报开发实例代码源码
Jan 20 Javascript
基于JavaScript实现图片连播和联级菜单实例代码
Jul 28 Javascript
vue中页面跳转拦截器的实现方法
Aug 23 Javascript
webpack中的热刷新与热加载的区别
Apr 09 Javascript
angular5 子组件监听父组件传入值的变化方法
Sep 30 Javascript
详解小程序如何改变onLoad的执行时机
Nov 01 Javascript
js表达式与运算符简单操作示例
Feb 15 Javascript
vue 路由缓存 路由嵌套 路由守卫 监听物理返回操作
Aug 06 Javascript
vue @click.native 绑定原生点击事件
Apr 22 Vue.js
jQuery实现鼠标划过展示大图的方法
Mar 09 #Javascript
javascript 对象数组根据对象object key的值排序
Mar 09 #Javascript
jquery插件corner实现圆角边框的方法
Mar 09 #Javascript
jQuery中animate用法实例分析
Mar 09 #Javascript
深入探讨JavaScript String对象
Mar 09 #Javascript
jQuery实现冻结表头的方法
Mar 09 #Javascript
jQuery焦点控制图层展示延迟隐藏的方法
Mar 09 #Javascript
You might like
强烈声明: 不要使用(include/require)_once
2013/06/06 PHP
php_screw安装使用教程(另一个PHP代码加密实现)
2014/05/29 PHP
php把数组值转换成键的方法
2015/07/13 PHP
PHP使用栈解决约瑟夫环问题算法示例
2017/08/27 PHP
PHP基于双向链表与排序操作实现的会员排名功能示例
2017/12/26 PHP
Laravel如何使用Redis共享Session
2018/02/23 PHP
实用javaScript技术-屏蔽类
2006/08/15 Javascript
cnblogs 代码高亮显示后的代码复制问题解决实现代码
2011/12/14 Javascript
js 获取input点选按钮的值的方法
2014/04/14 Javascript
讲解JavaScript中for...in语句的使用方法
2015/06/03 Javascript
Node.js Sequelize如何实现数据库的读写分离
2016/10/23 Javascript
Ajax与服务器(JSON)通信实例代码
2016/11/05 Javascript
JavaScript实现弹出广告功能
2017/03/30 Javascript
详解如何将 Vue-cli 改造成支持多页面的 history 模式
2017/11/20 Javascript
如何阻止小程序遮罩层下方图层滚动
2019/09/05 Javascript
微信小程序实现点击图片放大预览
2019/10/21 Javascript
react实现复选框全选和反选组件效果
2020/08/25 Javascript
[02:14]完美“圣”典2016风云人物:xiao8专访
2016/12/01 DOTA
Python open读写文件实现脚本
2008/09/06 Python
用于统计项目中代码总行数的Python脚本分享
2015/04/21 Python
Python对象转JSON字符串的方法
2016/04/27 Python
import的本质解析
2017/10/30 Python
在Django中输出matplotlib生成的图片方法
2018/05/24 Python
django进阶之cookie和session的使用示例
2018/08/17 Python
Python 矩阵转置的几种方法小结
2019/12/02 Python
如何将tensorflow训练好的模型移植到Android (MNIST手写数字识别)
2020/04/22 Python
python db类用法说明
2020/07/07 Python
Python批量修改xml的坐标值全部转为整数的实例代码
2020/11/26 Python
全球知名旅游社区巴西站点:TripAdvisor巴西
2016/07/21 全球购物
装潢设计实习自我鉴定
2013/09/19 职场文书
北大自主招生自荐信
2013/10/19 职场文书
自我评价范文
2013/12/22 职场文书
农业资源与环境专业自荐信范文
2013/12/30 职场文书
学校卫生检查制度
2014/02/03 职场文书
第一批党的群众路线教育实践活动总结报告
2014/07/03 职场文书
业务内勤岗位职责
2015/04/13 职场文书