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 相关文章推荐
javascript脚本调试方法小结
Nov 24 Javascript
JavaScript setTimeout和setInterval的使用方法 说明
Mar 25 Javascript
10个实用的脚本代码工具
May 04 Javascript
jquery validate使用攻略 第四步
Jul 01 Javascript
基于jquery的返回顶部效果(兼容IE6)
Jan 17 Javascript
JS使用ajax方法获取指定url的head信息中指定字段值的方法
Mar 24 Javascript
JS显示表格内指定行html代码的方法
Mar 31 Javascript
基于jquery animate操作css样式属性小结
Nov 27 Javascript
vue使用vue-cli快速创建工程
Jul 28 Javascript
浅谈vue中使用图片懒加载vue-lazyload插件详细指南
Oct 23 Javascript
Ionic学习日记实现验证码倒计时
Feb 08 Javascript
vue项目中实现的微信分享功能示例
Jan 21 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/10/09 PHP
php访问查询mysql数据的三种方法
2006/10/09 PHP
php自动加载方式集合
2016/04/04 PHP
php mysql数据库操作类(实例讲解)
2017/08/06 PHP
Gambit vs ForZe BO3 第二场 2.13
2021/03/10 DOTA
通过Javascript创建一个选择文件的对话框代码
2012/06/16 Javascript
js将控件隐藏及display属性的使用介绍
2013/12/30 Javascript
jQuery$命名冲突怎么办如何解决
2014/01/16 Javascript
jquery跟js初始化加载的多种方法及区别介绍
2014/04/02 Javascript
jQuery中siblings()方法用法实例
2015/01/08 Javascript
深入理解JavaScript系列(43):设计模式之状态模式详解
2015/03/04 Javascript
简化版手机端照片预览组件
2015/04/13 Javascript
浅谈Javascript实现继承的方法
2015/07/06 Javascript
详解使用Node.js 将txt文件转为Excel文件
2017/07/05 Javascript
基于Vue自定义指令实现按钮级权限控制思路详解
2018/05/23 Javascript
基于vue v-for 多层循环嵌套获取行数的方法
2018/09/26 Javascript
浅谈HTTP 缓存的那些事儿
2018/10/17 Javascript
jQuery+PHP实现上传裁剪图片
2020/06/29 jQuery
微信小程序页面间值传递的两种方法
2018/11/26 Javascript
vue+elementUI实现表格关键字筛选高亮
2020/10/26 Javascript
Vue 页面权限控制和登陆验证功能的实例代码
2019/06/20 Javascript
浅谈bootstrap layer.open中end的使用方法
2019/09/12 Javascript
JS工厂模式开发实践案例分析
2019/10/17 Javascript
Python ORM框架SQLAlchemy学习笔记之映射类使用实例和Session会话介绍
2014/06/10 Python
python简单猜数游戏实例
2015/07/09 Python
python验证码识别的示例代码
2017/09/21 Python
pip安装Python库时遇到的问题及解决方法
2017/11/23 Python
python Flask 装饰器顺序问题解决
2018/08/08 Python
详解使用Python下载文件的几种方法
2019/10/13 Python
python matplotlib拟合直线的实现
2019/11/19 Python
python中使用input()函数获取用户输入值方式
2020/05/03 Python
python安装和pycharm环境搭建设置方法
2020/05/27 Python
python 动态绘制爱心的示例
2020/09/27 Python
什么是Linux虚拟文件系统VFS
2015/08/25 面试题
三十年同学聚会致辞
2015/07/28 职场文书
员工手册董事长致辞
2015/07/29 职场文书