当前位置:软件学堂 > 资讯首页 > 网络编程 > 编程其他 > 随机动态文字效果JS代码怎么写

随机动态文字效果JS代码怎么写

2012/10/22 12:52:59作者:佚名来源:网络

移动端

【实例名称】

随机动态文字效果

【实例描述】

随机性的动态文字,对文字的颜色、大小等都没有固定。此效果就是把一些不规则的字体拼凑在一起。

【实例代码】

<html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>标题页</title> <script> var s=new Array("LOVE","晚上","看","电影","9点","必须", "秘密开始行动","如见","不到","请等待","10点","不见","赶紧闪人!") function txtFont(str){     var n=Math.floor(Math.random()*5);     var obj1=document.createElement("B");           //创建黑体标签     var obj2=document.createElement("font");        //创建字体标签     obj2.size=Math.floor(Math.random()*5+4);        //随机字体大小     obj2.innerText=str                                 if(n>4){      obj2.size=20                                //设置字体大小      obj1.appendChild(obj2);                     //添加字体标签到黑体标签内      return obj1.outerHTML                       //输出     }else{      return obj2.outerHTML     } } for(var i=0;i<10;i++) document.write(txtFont(s[i])+" ")                  //输出内容  </script> </head> <body> </body> </html>

【运行效果】

运行效果

【难点剖析】

本例的重点是随机字体的选取,以及动态创建标签。“B”标签表示字体为“黑体”,“font”标签用来设置字体的大小“Math random”用来获取。0~l之间的随机数,“Mathfloor“取数据的整数部分。

【源码下载】

本实例JS代码下载

标签: 文字  JS代码