当前位置:编程学习 > JS >>

文本框中的走马灯文字

文字走马灯效果,和其它的文字滚动没什么区别,只不过本款走马灯滚动的地方是在文本框内,而且是多个文本框连续不间断滚动,这个可以用于提示信息,把一些重要的必须用户填写的东西加上滚动的注释,以引起用户的注意。
答案:<html>
<head>
<title>文本框中的走马灯文字</title>
<style type="text/css">
<!--
body {font-size: 9pt; margin-top: 0px; margin-left: 4px; margin-right: 0px}
A { COLOR: black; FONT-SIZE: 13px; FONT-WEIGHT: 400; TEXT-DECORATION: none }
 A:hover { COLOR: red; FONT-SIZE: 13px; FONT-WEIGHT: 400; TEXT-DECORATION: underline }
a:active     { font: 9pt "宋体"; cursor: hand; color: #FF0033 }
-->
</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body>
<center>
<table border=0 bordercolor=blue borderlight=green style="border-collapse: collapse" cellpadding="0" cellspacing="0">
<tr><td align=center> </td></tr>
<tr><td align=center height=80><script language="javascript">
function drip(){
        wordy="走马灯滚动的地方是文本框内。把一些重要的内容加上滚动,以引起用户的注意。。";
        document.hey.a.value="";
        document.hey.b.value="";
        document.hey.c.value="";
        document.hey.d.value="";
        word="";
        beat=0;
        aa=0;
        bb=0;
        cc=0;
        dd=0;
        lo=wordy.length;
        drop(); 
}

function drop(){
        if(beat<=lo*3+1){
        beat=beat+1;
        if(beat<=1){
       document.hey.a.value=wordy;
        }
        if(beat>1 && beat<=lo+1){
                fin="";
                aa=aa+1;
                for(var x=0;x<=aa-1;x++){
                        fin=fin+" ";
                }
                fin=fin+wordy.substring(aa,lo);
                document.hey.a.value=fin;
                document.hey.b.value=wordy.substring(0,aa);
        }
        if(beat>lo+1 && beat<=lo*2+1){
                fin="";
                bb=bb+1;
                for(var x=0;x<=bb-1;x++){
                        fin=fin+" ";
                }
                fin=fin+wordy.substring(bb,lo);
                document.hey.b.value=fin;
                document.hey.c.value=wordy.substring(0,bb);
        }
        if(beat>lo*2+1 && beat<=lo*3+1){
                fin="";
                cc=cc+1;
                for(var x=0;x<=cc-1;x++){
                        fin=fin+" ";
                }
                fin=fin+wordy.substring(cc,lo);
                document.hey.c.value=fin;
                document.hey.d.value=wordy.substring(0,cc);
        }
        setTimeout("drop()",200);
        }
        else{
                document.hey.d.value=wordy;
        }
}
  </script>
<form name="hey">
<input type="text" name="a" size=12>
<input type="text" name="b" size=12>
<input type="text" name="c" size=12>
<input type="text" name="d" size=12>
<BR>
<input type="button" name="start" value="开始走马灯" onclick="drip()">
</td></tr></table></center>
<center>
</body>
</html>

上一个:一个清新的CSS表单布局
下一个:点击按钮后的超多功能合集

CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,