js实现文字在按钮上滚动的方法


Posted in Javascript onAugust 20, 2015

本文实例讲述了js实现文字在按钮上滚动的方法。分享给大家供大家参考。具体如下:

文字在按钮上滚动,以吸引人的注意,点击按钮后跳转到指定的网址,运行本演示代码后,在效果演示区可看到文字在按钮内的滚动效果。按钮的颜色和文字大小都可以重新定义。

运行效果如下图所示:

js实现文字在按钮上滚动的方法

在线演示地址如下:

具体代码如下:

<HTML>
<HEAD>
<TITLE>文字在按钮上滚动</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
</HEAD>
<BODY bgColor=#fef4d9>
<CENTER>
 <span class="STYLE1"><FONT face=隶书>文字在按钮上滚动</FONT></span>
</CENTER><BR>
<CENTER>
<TABLE borderColor=#FFCC00 border=5 borderlight="green">
 <TBODY>
 <TR>
  <TD align=middle><span class="STYLE2"><FONT face="Arial, Helvetica, sans-serif">效果显示</FONT></span></TD>
 </TR>
 <TR>
  <TD class=p9 align=middle>
   <SCRIPT language=JavaScript>
var message=" 欢迎进入百度";//Put Your Message Here
function ButtonURL(){
window.location="http://www.baidu.com"
}
function scroll()
{
 message = message.substring(1,message.length) + message.substring(0,1);
 document.bs.bs.value = message;
 setTimeout("scroll()",140);
}
window.onload=scroll
document.write('<style type="text/css">')
document.write('.select{background: blue;border-color:"yellow";color:"white";font-family:Arial,Verdana;font-size:12pt;font-weight: bold;}')
document.write('</STYLE>')
document.write('<form name=bs><INPUT class="select" TYPE="button" NAME="bs" value="" onclick="ButtonURL()"></FORM>')
</SCRIPT>
 </TD></TR></TBODY></TABLE></CENTER>
</BODY>
</HTML>

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

Javascript 相关文章推荐
出现“不能执行已释放的Script代码”错误的原因及解决办法
Aug 29 Javascript
JavaScript 字符编码规则
May 04 Javascript
javascript 写类方式之三
Jul 05 Javascript
ko knockoutjs动态属性绑定技巧应用
Nov 14 Javascript
js 获取坐标 通过JS得到当前焦点(鼠标)的坐标属性
Jan 04 Javascript
JavaScript中this的使用详解
Nov 08 Javascript
js清除浏览器缓存的几种方法
Mar 15 Javascript
node Buffer缓存区常见操作示例
May 04 Javascript
基于webpack4+vue-cli3项目实现换肤功能
Jul 17 Javascript
Layui表格行工具事件与数据回填方法
Sep 13 Javascript
基于Vue全局组件与局部组件的区别说明
Aug 11 Javascript
js实现搜索提示框效果
Sep 05 Javascript
jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享
Aug 20 #Javascript
js实现网页多级级联菜单代码
Aug 20 #Javascript
javascript常用的方法整理
Aug 20 #Javascript
JS实现的Select三级下拉菜单代码
Aug 20 #Javascript
遮罩层点击按钮弹出并且具有拖动和关闭效果(两种方法)
Aug 20 #Javascript
JS实现支持多选的遍历下拉列表代码
Aug 20 #Javascript
jQuery鼠标经过方形图片切换成圆边效果代码分享
Aug 20 #Javascript
You might like
?算你??的 PHP 程式大小
2006/12/06 PHP
mysql时区问题
2008/03/26 PHP
ThinkPHP利用PHPMailer实现邮件发送实现代码
2013/09/26 PHP
学习php设计模式 php实现访问者模式(Visitor)
2015/12/07 PHP
PHP程序员简单的开展服务治理架构操作详解(二)
2020/05/14 PHP
客户端 使用XML DOM加载json数据的方法
2010/09/28 Javascript
jQuery Validation PlugIn的使用方法详解
2015/12/18 Javascript
jQuery实现带遮罩层效果的blockUI弹出层示例【附demo源码下载】
2016/09/14 Javascript
js 获取本地文件及目录的方法(推荐)
2016/11/10 Javascript
js格式化时间的简单实例
2016/11/27 Javascript
详解springmvc 接收json对象的两种方式
2016/12/06 Javascript
bootstrap 模态框(modal)实现水平垂直居中显示
2017/01/23 Javascript
JavaScript设计模式之代理模式详解
2017/06/09 Javascript
浅谈Angular路由守卫
2017/08/26 Javascript
es6中new.target的作用和使用场景简单示例分析
2020/03/14 Javascript
Python中的sort()方法使用基础教程
2017/01/08 Python
机器学习的框架偏向于Python的13个原因
2017/12/07 Python
python数字图像处理实现直方图与均衡化
2018/05/04 Python
Python实现多条件筛选目标数据功能【测试可用】
2018/06/13 Python
python实现黑客字幕雨效果
2018/06/21 Python
python实现连连看辅助之图像识别延伸
2019/07/17 Python
PyTorch的Optimizer训练工具的实现
2019/08/18 Python
Cython编译python为so 代码加密示例
2019/12/23 Python
python新式类和经典类的区别实例分析
2020/03/23 Python
NFL Game Pass欧洲:在线观看NFL比赛直播和点播,以高清质量播放
2018/08/30 全球购物
乡镇庆八一活动方案
2014/02/02 职场文书
电子商务个人职业生涯规划范文
2014/02/12 职场文书
企业负责人任命书
2014/06/05 职场文书
合作协议书范本
2014/10/25 职场文书
群众路线四风对照检查材料
2014/11/04 职场文书
工作经验交流材料
2014/12/30 职场文书
员工离职通知函
2015/04/25 职场文书
2015年公路养护工作总结
2015/05/13 职场文书
诺贝尔奖获得者名言100句:句句启人心智,值永久收藏
2019/08/09 职场文书
python 字典和列表嵌套用法详解
2021/06/29 Python
Java实现超大Excel文件解析(XSSF,SXSSF,easyExcel)
2022/07/15 Java/Android