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 相关文章推荐
让回调函数 showResponse 也带上参数的代码
Aug 13 Javascript
使用 JScript 创建 .exe 或 .dll 文件的方法
Jul 13 Javascript
js jquery验证银行卡号信息正则学习
Jan 21 Javascript
js菜单点击显示或隐藏效果的简单实例
Jan 13 Javascript
JavaScript生成福利彩票双色球号码
May 15 Javascript
jQuery form 表单验证插件(fieldValue)校验表单
Jan 24 Javascript
javascript实现移动端上的触屏拖拽功能
Mar 04 Javascript
Highcharts学习之坐标轴
Aug 02 Javascript
js仿淘宝评价评分功能
Feb 28 Javascript
Vue实现购物车详情页面的方法
Aug 20 Javascript
vue使用swiper实现中间大两边小的轮播图效果
Nov 24 Javascript
JS图片懒加载技术实现过程解析
Jul 27 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在文件指定行中写入代码的方法
2012/05/23 PHP
ajax取消挂起请求的处理方法
2013/03/18 PHP
php中使用url传递数组的方法
2015/02/11 PHP
php删除文本文件中重复行的方法
2015/04/28 PHP
谈谈PHP连接Access数据库的注意事项
2016/08/12 PHP
JavaScript 继承机制的实现(待续)
2010/05/18 Javascript
jquery 与NVelocity 产生冲突的解决方法
2011/06/13 Javascript
JavaScript调用堆栈及setTimeout使用方法深入剖析
2013/02/16 Javascript
JS正则表达式大全(整理详细且实用)
2013/11/14 Javascript
js 3秒后跳转页面的实现代码
2014/03/10 Javascript
Google官方支持的NodeJS访问API,提供后台登录授权
2014/07/29 NodeJs
将List对象列表转换成JSON格式的类实现方法
2016/07/04 Javascript
解决Window10系统下Node安装报错的问题分析
2016/12/13 Javascript
bootstarp modal框居中显示的实现代码
2017/02/18 Javascript
javascript 的变量、作用域和内存问题
2017/04/19 Javascript
JS计算输出100元钱买100只鸡问题的解决方法
2018/01/04 Javascript
JS解析后台返回的JSON格式数据实例
2018/08/06 Javascript
微信小程序开发背景图显示功能
2018/08/08 Javascript
Angular ElementRef简介及其使用
2018/10/01 Javascript
python中mechanize库的简单使用示例
2014/01/10 Python
Python实现把json格式转换成文本或sql文件
2015/07/10 Python
Python Sql数据库增删改查操作简单封装
2016/04/18 Python
python用户管理系统的实例讲解
2017/12/23 Python
WxPython建立批量录入框窗口
2019/02/27 Python
Python操作列表常用方法实例小结【创建、遍历、统计、切片等】
2019/10/25 Python
pytorch随机采样操作SubsetRandomSampler()
2020/07/07 Python
美国最受欢迎的度假目的地优惠套餐:BookVIP
2018/09/27 全球购物
实习生自荐信范文分享
2013/11/27 职场文书
倡议书的写法
2014/08/30 职场文书
高中军训的心得体会
2014/09/01 职场文书
合同权益转让协议书模板
2014/11/18 职场文书
2015教师年度思想工作总结
2015/04/30 职场文书
商业计划书如何写?关键问题有哪些?
2019/07/11 职场文书
原生Js 实现的简单无缝滚动轮播图的示例代码
2021/05/10 Javascript
悬疑名作《朋友游戏》动画无字ED宣传片 新角色公开
2022/04/13 日漫
Java 定时任务技术趋势简介
2022/05/04 Java/Android