Das Beispiel in diesem Artikel beschreibt, wie Sie das Scrollen von Text auf Schaltflächen mithilfe von js implementieren. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
Der Text scrollt auf der Schaltfläche, um Aufmerksamkeit zu erregen. Nach dem Klicken auf die Schaltfläche springt er zur angegebenen URL. Nachdem Sie diesen Democode ausgeführt haben, können Sie den Scrolleffekt des Textes in der Schaltfläche im Effektdemonstrationsbereich sehen. Die Farbe und Textgröße der Schaltfläche kann neu definiert werden.
Der Betriebseffekt ist wie folgt:
Die Online-Demo-Adresse lautet wie folgt:
http://demo.jb51.net/js/2015/js-txt-scroll-button-style-codes/
Der spezifische Code lautet wie folgt:
<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>Ich hoffe, dass dieser Artikel für das JavaScript-Programmierdesign aller hilfreich sein wird.
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
