仿京东快报向上滚动的实例
2017-12-13 10:18
399 查看
实例如下:
<!doctype html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script src="http://code.jquery.com/jquery-1.11.0.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="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" target="_blank">aaaaaa</a></li> <li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" target="_blank">bbbbbb</a></li> <li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" target="_blank">cccccc</a></li> <li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" target="_blank">dddddd</a></li> <li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" 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> </body> </html>
以上这篇仿京东快报向上滚动的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
相关文章推荐
- 仿京东首页的京东快报,自动向上滚动的广告条
- 高仿京东APP首页“京东快报”自己主动向上滚动的广告条
- 高仿京东APP首页“京东快报”自动向上滚动的广告条
- 【Android自定义控件】仿京东首页的京东快报,自动向上滚动的广告条
- js实现单行文本向上滚动效果实例代码
- 基于JS实现新闻列表无缝向上滚动实例代码
- Android仿京东快报信息滚动效果
- 自定义控件实现(淘宝头条/京东快报)垂直循环滚动栏目
- 【Android】App首页上下滚动快报控件 通知控件 类似京东快报控件(二)
- js实现单行文本向上滚动效果实例代码
- 基于JS实现新闻列表无缝向上滚动实例代码
- 【Android】App首页上下滚动快报控件 通知控件 类似京东快报控件(一)
- android高仿京东快报(垂直循环滚动新闻栏)
- jquery滚动效果-无间隙向上滚动
- Cocos2d-x3.0游戏实例之《别救我》第三篇——循环滚动背景(上)
- jQuery实现页面滚动时层智能浮动定位实例探讨
- 如何用js实现鼠标向上滚动时浮动导航
- jQuery模拟Marquee实现无缝滚动效果完整实例
- javascript 单行文字向上跑马灯滚动显示
- android 仿京东抢购上下轮播消息字幕垂直滚动