Maison > Article > interface Web > méthode js pour implémenter le défilement de texte sur les compétences Buttons_Javascript

méthode js pour implémenter le défilement de texte sur les compétences Buttons_Javascript

WBOYoriginal: 2016-05-16 15:43:561199parcourir

L'exemple de cet article décrit comment implémenter le défilement de texte sur les boutons à l'aide de js. Partagez-le avec tout le monde pour votre référence. Les détails sont les suivants :

Le texte défile sur le bouton pour attirer l'attention. Après avoir cliqué sur le bouton, il passe à l'URL spécifiée. Après avoir exécuté ce code de démonstration, vous pouvez voir l'effet de défilement du texte dans le bouton dans la zone de démonstration des effets. La couleur et la taille du texte du bouton peuvent être redéfinies.

L'effet de l'opération est comme indiqué ci-dessous :

L'adresse de la démo en ligne est la suivante :

http://demo.jb51.net/js/2015/js-txt-scroll-button-style-codes/

Le code spécifique est le suivant :

<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>

J'espère que cet article sera utile à la conception de la programmation JavaScript de chacun.

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：code js pour obtenir un défilement fluide (texte et images)_compétences javascriptArticle suivant：code js pour obtenir un défilement fluide (texte et images)_compétences javascript

Articles Liés

Voir plus