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 相关文章推荐
js处理自己不能定义二维数组的方法详解
Mar 03 Javascript
JQuery中层次选择器用法实例详解
May 18 Javascript
jQuery-1.9.1源码分析系列(十一)DOM操作续之克隆节点
Dec 01 Javascript
jQuery实现的省市县三级联动菜单效果完整实例
Aug 01 Javascript
jquery文字填写自动高度的实现方法
Nov 07 Javascript
微信小程序异步API为Promise简化异步编程的操作方法
Aug 14 Javascript
深入理解JavaScript 中的匿名函数((function() {})();)与变量的作用域
Aug 28 Javascript
vue拖拽排序插件vuedraggable使用方法详解
Aug 21 Javascript
深入理解使用Vue实现Context-Menu的思考与总结
Mar 09 Javascript
element form 校验数组每一项实例代码
Oct 10 Javascript
Vue解决echart在element的tab切换时显示不正确问题
Aug 03 Javascript
原生JS实现拖拽效果
Dec 04 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
安健A254立体声随身听的分析与打磨
2021/03/02 无线电
使用apache模块rewrite_module (转)
2007/02/14 PHP
PHP中$_SERVER的详细参数与说明介绍
2013/10/26 PHP
从盛大通行证上摘下来的身份证验证js代码
2011/01/11 Javascript
弹出层之1:JQuery.Boxy (一) 使用介绍
2011/10/06 Javascript
jQuery动态添加 input type=file的实现代码
2012/06/14 Javascript
输入自动提示搜索提示功能的javascript:sugggestion.js
2013/09/02 Javascript
jquery live()调用不存在的解决方法
2014/02/26 Javascript
js生成的验证码的实现与技术分析
2014/09/17 Javascript
jQuery中的AjaxSubmit使用讲解
2016/09/25 Javascript
JavaScript构建自己的对象示例
2016/11/29 Javascript
js实现显示手机号码效果
2017/03/09 Javascript
vue 循环加载数据并获取第一条记录的方法
2018/09/26 Javascript
JS简单判断是否在微信浏览器打开的方法示例
2019/01/08 Javascript
详解Vue用cmd创建项目
2019/02/12 Javascript
javascript实现贪吃蛇经典游戏
2020/04/10 Javascript
Javascript中window.name属性详解
2020/11/19 Javascript
[02:42]岂曰无衣,与子同袍!DOTA2致敬每一位守护人
2020/02/17 DOTA
Python用GET方法上传文件
2015/03/10 Python
Python元组操作实例分析【创建、赋值、更新、删除等】
2017/07/24 Python
Python文件和流(实例讲解)
2017/09/12 Python
python放大图片和画方格实现算法
2018/03/30 Python
Python3利用Dlib实现摄像头实时人脸检测和平铺显示示例
2019/02/21 Python
Python多线程通信queue队列用法实例分析
2020/03/24 Python
python上传时包含boundary时的解决方法
2020/04/08 Python
Python tkinter制作单机五子棋游戏
2020/09/14 Python
HTML5操作WebSQL数据库的实例代码
2017/08/26 HTML / CSS
Crocs美国官方网站:卡骆驰洞洞鞋
2017/08/04 全球购物
比利时香水网上商店:NOTINO
2018/03/28 全球购物
转预备党员政审材料
2014/02/06 职场文书
节约每一滴水演讲稿
2014/09/09 职场文书
综治工作汇报材料
2014/10/27 职场文书
意向协议书
2015/01/27 职场文书
2015年小学语文教师工作总结
2015/10/23 职场文书
《家世》读后感:看家训的力量
2019/12/30 职场文书
springboot 自定义配置 解决Boolean属性不生效
2022/03/18 Java/Android