文字垂直滚动之javascript代码


Posted in Javascript onJuly 29, 2015

在大型的网站新闻公告和友情链接等领域经常有这种文字或图片垂直滚动的效果,下面就介绍一下文字垂直滚动的javascript代码。

javascript代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="https://3water.com/" />
<title>三水点靠木</title>
<style> 
a { 
 display:block; 
 font-size:15px; 
 line-height:18px; 
 text-decoration:none; 
 color:#333; 
 font-family:Arial; 
 font-size:12px; 
} 
.main{ 
 background:no-repeat 4px 5px; 
 border:1px solid #aaa; 
 width:400px; 
 padding:3px 2px 2px 20px; 
} 
#thediv{ 
 height:36px; 
 overflow:hidden; 
} 
</style>
<script type="text/javascript">
var c, _ = Function;
window.onload=function(){ 
 with (o = document.getElementById("thediv")){ 
 innerHTML += innerHTML; onmouseover = _("c=1"); onmouseout = _("c=0");
 } 
 (F=_("if(#%18||!c)#++,#%=o.scrollHeight>>1;setTimeout(F,#%18?10:3000);".replace(/#/g,"o.scrollTop")))(); 
}
</script> 
</head> 
<body> 
<div class="main"> 
<div id="thediv"> 
 <a>蚂蚁部落欢迎您</a> 
 <a>只有奋斗才会有好的结果</a> 
 <a>高手都是从菜鸟成长而来</a> 
 <a>太阳马上就要出来了</a> 
 </div> 
</div> 
</body> 
</html>

以上代码就实现了文字垂直滚动的效果,文字可有上下间歇性的滚动,有需要的朋友可以来参考下,希望大家喜欢。

Javascript 相关文章推荐
JavaScript 设计模式学习 Factory
Jul 29 Javascript
document.body.scrollTop 值总为0的解决方法 比较常见的标准问题
Nov 30 Javascript
JavaScript 的继承
Oct 01 Javascript
详解Javascript中的原型OOP
Oct 12 Javascript
获取IE浏览器Cookie信息的方法
Jan 23 Javascript
vue.js在标签属性中插入变量参数的方法
Mar 06 Javascript
解决Mac下安装nmp的淘宝镜像失败问题
May 16 Javascript
jQuery中将json数据显示到页面表格的方法
May 27 jQuery
微信小程序bindinput与bindsubmit的区别实例分析
Apr 17 Javascript
JavaScript箭头函数中的this详解
Jun 19 Javascript
JS访问对象两种方式区别解析
Aug 29 Javascript
仿照Element-ui实现一个简易的$message方法
Sep 14 Javascript
如何使用jQuery技术开发ios风格的页面导航菜单
Jul 29 #Javascript
如何用javascript计算文本框还能输入多少个字符
Jul 29 #Javascript
详解JavaScript的Polymer框架中的通知交互
Jul 29 #Javascript
JavaScript的Polymer框架中dom-repeat与VM的相关操作
Jul 29 #Javascript
浅谈JavaScript的Polymer框架中的事件绑定
Jul 29 #Javascript
探讨JavaScript中的Rest参数和参数默认值
Jul 29 #Javascript
JS的框架Polymer中的dom-if和is属性使用说明
Jul 29 #Javascript
You might like
PHP iconv 解决utf-8和gb2312编码转换问题
2010/04/12 PHP
解析:通过php socket并借助telnet实现简单的聊天程序
2013/06/18 PHP
解析csv数据导入mysql的方法
2013/07/01 PHP
CI框架学习笔记(二) -入口文件index.php
2014/10/27 PHP
php获取'/'传参的值简单方法
2017/07/13 PHP
PHP文件后缀不强制为.php方法
2019/03/31 PHP
php设计模式之工厂模式用法经典实例分析
2019/09/20 PHP
利用json获取字符出现次数的代码
2012/03/22 Javascript
使用jquery解析XML的方法
2014/09/05 Javascript
node.js使用require()函数加载模块
2014/11/26 Javascript
JavaScript 学习笔记之变量及其作用域
2015/01/14 Javascript
js实现最短的XML格式化工具实例
2015/03/12 Javascript
javascript操作select元素实例分析
2015/03/27 Javascript
JQuery中Bind()事件用法分析
2015/05/05 Javascript
学习JavaScript正则表达式
2015/11/13 Javascript
Javascript中的arguments对象
2016/06/20 Javascript
Vue.js 单页面多路由区域操作的实例详解
2017/07/17 Javascript
修改UA在PC中访问只能在微信中打开的链接方法
2017/11/27 Javascript
nodejs实现解析xml字符串为对象的方法示例
2018/03/14 NodeJs
详解auto-vue-file:一个自动创建vue组件的包
2019/04/26 Javascript
[59:48]DOTA2-DPC中国联赛 正赛 VG vs Magma BO3 第一场 1月26日
2021/03/11 DOTA
Python检测一个对象是否为字符串类的方法
2015/05/21 Python
使用Python写个小监控
2016/01/27 Python
详解python使用Nginx和uWSGI来运行Python应用
2018/01/09 Python
100行Python代码实现自动抢火车票(附源码)
2018/01/11 Python
python对绑定事件的鼠标、按键的判断实例
2019/07/17 Python
python中的subprocess.Popen()使用详解
2019/12/25 Python
Python socket处理client连接过程解析
2020/03/18 Python
python由已知数组快速生成新数组的方法
2020/04/08 Python
python批量生成条形码的示例
2020/10/10 Python
在印度上传处方,在线订购药品:Medlife
2019/03/28 全球购物
澳大利亚电商Catch新西兰站:Catch.co.nz
2020/05/30 全球购物
新闻报道策划方案
2014/06/11 职场文书
儿子满月酒致辞
2015/07/29 职场文书
Python字符串常规操作小结
2022/04/03 Python
python中pd.cut()与pd.qcut()的对比及示例
2022/06/16 Python