javascript:google向上向下滚动特效,兼容IE6,7,8,FF
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title></title>
<style type="text/css">
#google1,#google2,#google3,#google4{border:2px solid #06c;border-left-width:20px;
width:230px;height:40px;margin:10px 0;font-size:12px;
padding-left:20px;overflow:hidden;font-family:Arial;
background:#B7D6E6;
}
ul{margin:0px;padding:0px;list-style-type:none;}
li{line-height:20px; color:#06C;}
</style>
<body>
<div id="google1">
<ul id="dhooo1">
<li>矢量素材</li>
<li>PSD分层</li>
<li>PNG图标</li>
<li>网页特效源码</li>
<li>高清图片素材</li>
<li>字体下载</li>
<li>dedecms模板</li>
<li>动网模板</li>
<li><span style="color:red">找素材，搜搜呗！</span></li>
<li>www.sosoby.com</li>
</ul>
</div>
<div id="google2">
<ul id="dhooo2">
<li>矢量素材</li>
<li>PSD分层</li>
<li>PNG图标</li>
<li>网页特效源码</li>
<li>高清图片素材</li>
<li>字体下载</li>
<li>dedecms模板</li>
<li>动网模板</li>
<li><span style="color:red">找素材，搜搜呗！</span></li>
<li>www.sosoby.com</li>
</ul>
</div>
<div id="google3">
<ul id="dhooo3">
<li>矢量素材</li>
<li>PSD分层</li>
<li>PNG图标</li>
<li>网页特效源码</li>
<li>高清图片素材</li>
<li>字体下载</li>
<li>dedecms模板</li>
<li>动网模板</li>
<li><span style="color:red">找素材，搜搜呗！</span></li>
<li>www.sosoby.com</li>
</ul>
</div>
<div id="google4">
<ul id="dhooo4">
<li>矢量素材</li>
<li>PSD分层</li>
<li>PNG图标</li>
<li>网页特效源码</li>
<li>高清图片素材</li>
<li>字体下载</li>
<li>dedecms模板</li>
<li>动网模板</li>
<li><span style="color:red">找素材，搜搜呗！</span></li>
<li>www.sosoby.com</li>
</ul>
</div>
<script >
xS=function(A,B,C,D,E,F){
var $=function (id){return document.getElementById(id)},Y=+!!F;
(A=$(A)).appendChild((B=$(B)).cloneNode(true));
(function (){
var m=A.scrollTop%C?(E||0):D;
A.scrollTop=[0,B.offsetHeight][Y]==A.scrollTop?[B.offsetHeight-1,1][Y]:(A.scrollTop+[-1,1][Y]);
setTimeout(arguments.callee,m);
})()
return arguments.callee;
}
xS
('google1','dhooo1',40,1000,10,1)
('google2','dhooo2',40,1000,10)
('google3','dhooo3',40,1,10)
('google4','dhooo4',40,1,10,1)
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title></title>
<style type="text/css">
#google1,#google2,#google3,#google4{border:2px solid #06c;border-left-width:20px;
width:230px;height:40px;margin:10px 0;font-size:12px;
padding-left:20px;overflow:hidden;font-family:Arial;
background:#B7D6E6;
}
ul{margin:0px;padding:0px;list-style-type:none;}
li{line-height:20px; color:#06C;}
</style>
<body>
<div id="google1">
<ul id="dhooo1">
<li>矢量素材</li>
<li>PSD分层</li>
<li>PNG图标</li>
<li>网页特效源码</li>
<li>高清图片素材</li>
<li>字体下载</li>
<li>dedecms模板</li>
<li>动网模板</li>
<li><span style="color:red">找素材，搜搜呗！</span></li>
<li>www.sosoby.com</li>
</ul>
</div>
<div id="google2">
<ul id="dhooo2">
<li>矢量素材</li>
<li>PSD分层</li>
<li>PNG图标</li>
<li>网页特效源码</li>
<li>高清图片素材</li>
<li>字体下载</li>
<li>dedecms模板</li>
<li>动网模板</li>
<li><span style="color:red">找素材，搜搜呗！</span></li>
<li>www.sosoby.com</li>
</ul>
</div>
<div id="google3">
<ul id="dhooo3">
<li>矢量素材</li>
<li>PSD分层</li>
<li>PNG图标</li>
<li>网页特效源码</li>
<li>高清图片素材</li>
<li>字体下载</li>
<li>dedecms模板</li>
<li>动网模板</li>
<li><span style="color:red">找素材，搜搜呗！</span></li>
<li>www.sosoby.com</li>
</ul>
</div>
<div id="google4">
<ul id="dhooo4">
<li>矢量素材</li>
<li>PSD分层</li>
<li>PNG图标</li>
<li>网页特效源码</li>
<li>高清图片素材</li>
<li>字体下载</li>
<li>dedecms模板</li>
<li>动网模板</li>
<li><span style="color:red">找素材，搜搜呗！</span></li>
<li>www.sosoby.com</li>
</ul>
</div>
<script >
xS=function(A,B,C,D,E,F){
var $=function (id){return document.getElementById(id)},Y=+!!F;
(A=$(A)).appendChild((B=$(B)).cloneNode(true));
(function (){
var m=A.scrollTop%C?(E||0):D;
A.scrollTop=[0,B.offsetHeight][Y]==A.scrollTop?[B.offsetHeight-1,1][Y]:(A.scrollTop+[-1,1][Y]);
setTimeout(arguments.callee,m);
})()
return arguments.callee;
}
xS
('google1','dhooo1',40,1000,10,1)
('google2','dhooo2',40,1000,10)
('google3','dhooo3',40,1,10)
('google4','dhooo4',40,1,10,1)
</script>
</body>
</html>
这个代码是我之前带网上找的，因为今天再次用到，所以记录下来，免得以后都找不到，我现在想去搜它的说明文档都搜不到！
这个代码非常简洁，且浏览器兼容性超好，唯一的问题就是如果你要滚动多条的话就会有问题! 所以需要调参数C 和 样式里面的高度
专注iOS、Golang开发。
技术博客：http://xiaopin.cnblogs.com
分类:
Web Javascript
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 周边上新：园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源！
· 分享 3 个 .NET 开源的文件压缩处理库，助力快速实现文件压缩解压功能！
· Ollama——大语言模型本地部署的极速利器
· [AI/GPT/综述] AI Agent的设计模式综述