文字以破碎形式组合

网页特效代码

网站首页菜单导航日期时间背景图像图层样式鼠标键盘页面窗口色彩表格链接文字表单按钮计数转换游戏娱乐综合实例

热点推荐:钻石站长工具
生意站长必备软件
我们是致力收藏最实用的网页特效代码！

您的位置: 网页特效 -> 链接文字 -> 文字以破碎形式组合

文字以破碎形式组合

作者:文字以破碎形式组合发布时间:2007-11-21 22:25:04 发布人: admin

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>中国建站之家网页特效演示，文字以破碎形式组合</title>
<script>
var textwidth=200
var textheight=40
var message=new Array()
message[0]="你好"
message[1]="欢迎"
message[2]="光临"
message[3]="网页特效"
var x_finalpos=-1
var y_finalpos=50
var x_slices=24
var y_slices=1
var pause=10
var screenwidth=700
var screenheight=400
var x_step=new Array()
var y_step=new Array()
var x_randompos=0
var y_randompos=0
var i_loop=0
var max_loop=24
var i_text=0
var width_slice=Math.floor(textwidth/x_slices)
var height_slice=Math.floor(textheight/y_slices)
var cliptop=0
var clipbottom=height_slice
var clipleft=0
var clipright=width_slice
var spancounter=0

function initiate() {
	if (x_finalpos==-1) {
		x_finalpos=Math.floor(document.body.clientWidth/2)-Math.floor(textwidth/2)
	}
	if (y_finalpos==-1) {
		y_finalpos=Math.floor(document.body.clientHeight/2)-Math.floor(textheight/2)
	}
	cliptop=0
	clipbottom=height_slice
	clipleft=0
	clipright=width_slice
	i_loop=0
	spancounter=0
    if (document.all) {
 	    for (i=0;i<=y_slices-1;i++) {
			for (ii=0;ii<=x_slices-1;ii++) {
				var thisspan=eval("document.all.span"+spancounter+".style")
				x_randompos=Math.ceil(screenwidth*Math.random())
				y_randompos=Math.ceil(screenheight*Math.random())
				thisspan.posLeft=x_randompos
				thisspan.posTop=y_randompos
                thisspan.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
				clipleft+=width_slice
		        clipright+=width_slice
		        spancounter++
			}
        	clipleft=0
	        clipright=width_slice
	        cliptop+=height_slice
	        clipbottom+=height_slice
		}
   }
   explode_IE()
}

function changetext() {
	spancounter=0
	for (i=0;i<=y_slices-1;i++) {
		for (ii=0;ii<=x_slices-1;ii++) {
			var thisspan=eval("document.all.span"+spancounter+".style")		
			thisspan.posLeft=-5000
			spancounter++
		}
	}
	spancounter=0
	if (i_text>message.length-1) {i_text=0}
	for (i=0;i<=y_slices-1;i++) {
		for (ii=0;ii<=x_slices-1;ii++) {
			var thisinnerspan=eval("span"+spancounter)
    		thisinnerspan.innerHTML=message[i_text]
			spancounter++
		}
	}
	i_text++
	initiate()
}

function explode_IE() {
	spancounter=0
	if (i_loop<=max_loop-1) {
		for (i=0;i<=y_slices-1;i++) {
			for (ii=0;ii<=x_slices-1;ii++) {
				var thisspan=eval("document.all.span"+spancounter+".style")
				x_step[spancounter]=(x_finalpos-thisspan.posLeft)/(max_loop-i_loop)
				y_step[spancounter]=(y_finalpos-thisspan.posTop)/(max_loop-i_loop)		
				thisspan.posLeft+=x_step[spancounter]
				thisspan.posTop+=y_step[spancounter]
				spancounter++
			}
		}
		i_loop++
		var timer=setTimeout("explode_IE()",pause)
	}
	else {
		spancounter=0
		clearTimeout(timer)
		var timer=setTimeout("changetext()",2000)
	}
}

// - End of JavaScript - -->
</script>

<style>.spanstyle {
	BACKGROUND-COLOR: #ffffff; BORDER-BOTTOM-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-TOP-STYLE: solid; COLOR: #ff00ff; FONT-FAMILY: 宋体; FONT-SIZE: 20px; HEIGHT: 30px; LEFT: -5000px; PADDING-BOTTOM: 1px; PADDING-LEFT: 1px; PADDING-RIGHT: 1px; PADDING-TOP: 1px; POSITION: absolute; TEXT-ALIGN: center; WIDTH: 192px
}
</style><script language="JavaScript">

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0 && parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n]) && d.all) x=d.all[n]; for (i=0;!x && i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x && d.layers && i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x  &&  d.getElementById) x=d.getElementById(n); return x;
}

function MM_showHideLayers() { //v3.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v='hide')?'hidden':v; }
    obj.visibility=v; }
}
//-->
</script>

</head>

<body onload="changetext()"> 
<script>

</script>

</body>

</html>

文字以破碎形式组合

将本文收藏到QQ书签与更多好友分享

上一篇：文章：很有冲击力的文字显示效果下一篇：文章：可以开合的文字说明网页特效代码