Heim > Artikel > Web-Frontend > js-Methode zum Implementieren des Text-Scrollings auf Buttons_Javascript-Fähigkeiten

js-Methode zum Implementieren des Text-Scrollings auf Buttons_Javascript-Fähigkeiten

WBOYOriginal: 2016-05-16 15:43:561199Durchsuche

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.

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：js-Code, um nahtloses Scrollen (Text und Bilder) zu erreichen_Javascript-KenntnisseNächster Artikel：js-Code, um nahtloses Scrollen (Text und Bilder) zu erreichen_Javascript-Kenntnisse

In Verbindung stehende Artikel

Mehr sehen