好资源导航 » 文章资讯 » jQuery实现动态向上滚动

jQuery实现动态向上滚动

2023-07-08 00:25:03 78

本文实例为大家分享了jQuery实现动态向上滚动的具体代码，供大家参考，具体内容如下

总结：概括滚动的新闻、字幕、图片：两个最核心功能：

1、”永动“（infinite）

2、循环

js实现”永动“（infinite）的实现方法离不开定时器setInterval()，也就是说每过一段时间都要执行一次某个函数，从而实现无休止滚动；

而循环的实现：appendTo()或者append,三目运算符（或者ifelse）,insertBefore()或者prepend()等等好多种方法。

代码：





jQuery动态向上滚动








向幸福生活致敬111！

向幸福生活致敬222！

向幸福生活致敬333！

向幸福生活致敬111！

第一条新闻第二条新闻第三条动态

恭喜133****1062用户获得10元手机话费

恭喜153****0792用户获得50元助学代金券

恭喜153****3890用户获得330元上课大礼包

恭喜189****0883用户获得330元上课大礼包

恭喜133****6823用户获得1500元现金

恭喜153****5050用户获得330元上课大礼包

再为大家分享一段之前收藏的代码：jQuery文字逐行向上滚动代码：

实现原理：整体向上滚动一行距离后，将第一行appendTo最后一行



你是我的小丫小苹果
怎么爱你都不嫌多
红红的小脸儿温暖我的心窝
点亮我生命的火火火火火
你是我的小丫小苹果
就像天边最美的云朵
春天又来到了花开满山坡
种下希望就会收获


functionautoScroll(obj){
$(obj).find("ul").animate({marginTop:"-39px"},500,function(){
$(this).css({marginTop:"0px"}).find("li:first").appendTo(this);
})
}
$(function(){
setInterval('autoScroll(".apple")',2000);
})

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

返回顶部
514930285
czq8825@qq.com

jQuery实现动态向上滚动

热门推荐

随机推荐