非常棒的文字切换特效

2024-09-05 12:21:25

字体：大中小

来源：转载

供稿：网友

非常棒的文字切换特效，带了阴影效果、打字效果，单字依次出现，视觉效果不错，如果你懂得JS的话，可以继续修善，让它更完美。主要是JS时间与CSS滤镜的结合打造的一种文字效果。

<html><head><title>文字切换特效</title><style>.let{color:white;font-family:Verdana;font-weight:bold;width:500;filter:Shadow (Color="#6699CC", Direction="135")wave(Add="0", Phase="4", Freq="9", LightStrength="20", Strength="1") ; }</style></head><body onload="startmot()"><script language="JavaScript">var regel = 0; var size = 20; var delay = 1200;var speed = 20;var step = 10;var sent = new Array(){sent[0] = "百度一下，你就知道";sent[1] = "千里之行，始于足下";sent[2] = "读万卷书，行千里路";}sent[sent.length] = sent[0];var veran = 0;var num = 0;var x = 0;//Don't changefunction moto(){output = "";for(letter = 0;letter<sent[regel+1].length;letter++){if(veran == letter){if(x==0){num=num+step;}else{num=num-step;}gr = size-num;if(gr < 1){x=1;gr=1;}if(gr>size)gr=size;output += "<font style='font-size:"+gr +"pt'>"+sent[regel+x].substring(letter, letter+1)+"</font>";if(num < 0 && x==1){veran++;x=0;}}else{if(veran > letter){output += "<font style='font-size:"+size +"pt'>"+sent[regel+1].substring(letter, letter+1)+"</font>";}else{output += "<font style='font-size:"+size +"pt'>"+sent[regel].substring(letter, letter+1)+"</font>";}}}return output;}function startmot(){if(regel==sent.length-1)regel=0;balk.innerHTML = moto();if(veran==sent[regel+1].length){regel++;veran = 0;setTimeout("startmot()", delay);}else{setTimeout("startmot()", speed);}}</script><table style="cursor:hand" onclick="location='/'" align="left" id="tafel" bgcolor="#008000" width="486" height="60">  <tr>    <td bgcolor="FF6666">      <div class="let" ID="balk" align="left">      </div>   </td>  </tr></table></body></html>

上一篇：响应鼠标变化的立体阴影文字

下一篇：Js实现旋转的3D文字特效

学习交流

如何查找有故障的配件

如何查找有故障的配件...

热门图片

猜你喜欢的新闻

猜你喜欢的关注