漂浮图片全屏显示随机切换特效

作者:sky 点击:229 评论:0 发布时间:周日, 06/28/2009 - 18:42 所属分类:图像特效

几张图片漂浮，全屏显示后随机切换效果，自定义图片和数量。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <META content="MSHTML 6.00.2900.2144" name=GENERATOR> <META http-equiv=Content-Type content="text/html; charset=gb2312"> <meta name="keywords" content="站长,网页特效,js特效,js脚本,脚本,广告代码,zzjs,zzjs.net,sky,www.zzjs.net,站长特效网" /> <meta name="description" content="www.zzjs.net,站长特效网，站长必备js特效及广告代码。全力打造国内一流网页特效站！" /> <TITLE>站长特效漂浮图片全屏显示随机切换特效站长特效网</TITLE> </HEAD> <BODY> <a href="http://www.zzjs.net/">站长特效网</a>，以质量为核心，以实用为目的，打造一流网页特效站！zzjs.net，站长js特效。<hr>  <script type="text/javascript" src="http://www.zzjs.net/ad/tc.js"></script> <STYLE type=text/css> BODY{PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #000; LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; OVERFLOW: hidden; WIDTH: 100%; CURSOR: crosshair; PADDING-TOP: 0px; POSITION: absolute; TOP: 0px; HEIGHT: 100%; zIndex: -2} IMG{BORDER-RIGHT: #222 1px solid; BORDER-TOP: #222 1px solid; LEFT: -10000px; BORDER-LEFT: #222 1px solid; CURSOR: pointer; BORDER-BOTTOM: #222 1px solid; POSITION: absolute} </STYLE> <SCRIPT type=text/javascript> window.onerror = new Function("return true"); screen.bufferDepth = 16; object = new Array(); //////////////////// am = 40; TEMPO = 5000; /////////////////// W0 = 0; H0 = 0; nx = 0; ny = 0; K = 0; Kb = -1; function zoomIn(N){ object[N].img.cursor="crosshair"; object[N].zoomIn(); object[N].img.zIndex=0; }//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js特效代码，还有许多广告代码下载。 function zoomOut(N){ object[N].img.cursor="pointer"; object[N].zoomOut(); } function zyva(N){ if(N!=Kb){ clearTimeout(object[Kb].TO); zoomIn(N); object[Kb].BR=true; zoomOut(Kb); Kb=N; } }//欢迎来到站长z特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js特效代码，还有许多广告代码下载。 function nextImg(){ if(Kb>=0)zoomOut(Kb); Kb=K%nbI; zoomIn(Kb); K++; }//欢迎来到站c长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js特效代码，还有许多广告代码下载。 function CObj(N,img){ this.A = Math.round(Math.random()*10)+1; this.B = Math.round(Math.random()*10)+3; this.k = 0.1 * N; this.L = 0; this.T = 0; this.W = W0; this.H = H0; this.xb = 0; this.img = img.style; this.img.zIndex = 1; this.obj = "object["+N+"]."; this.BR = false; this.TO = 0; this.mainloop = function () { with (this) { k += 0.001; L = ((nx-W) * .5) + (Math.cos(k * A) * .5) * (nx - W); T = ((ny-H) * .5) + (Math.cos(k * B) * .5) * (ny - H); with(img){ width = Math.floor(W); height = Math.floor(H); top = Math.floor(T); left = Math.floor(L); } setTimeout(obj+"mainloop();", 32); } } //欢迎来到站长q特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js特效代码，还有许多广告代码下载。 this.zoomIn = function() { with (this) { W += (nx - W) * (.1 * am/(.01+(nx - W))); H += (ny - H) * (.1 * am/(.01+(nx - W))); if(!BR){ if(W >= nx) TO=setTimeout("nextImg();", TEMPO); else setTimeout(obj+"zoomIn();", 32); } } } //欢迎来到站长特g效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js特效代码，还有许多广告代码下载。 this.zoomOut = function() { with (this) { W -= W / (am * .5); H -= H / (am * .5); if(W >= 2) setTimeout(obj+"zoomOut();", 32); else { BR=false; img.zIndex=1; zoomStart(); } } } this.zoomStart = function() { with (this) { W++; H += H0 / W0; if(W<W0 || H<H0)setTimeout(obj+"zoomStart();", 32); } } //欢迎来到站长特效c网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js特效代码，还有许多广告代码下载。 this.mainloop(); } function resize() { nx = document.body.clientWidth; ny = document.body.clientHeight; W0 = nx / nbI; H0 = ny / nbI; if(H0<W0*.56)H0=W0*.56; } onresize = resize; onload = function() { img = document.getElementById("www_zzjs_net").getElementsByTagName("img"); nbI = img.length; resize(); for(i=0;i<nbI;i++) object[i] = new CObj(i,img[i]); nextImg(); }//欢迎来到站长特效网，我们的网址是www.z zjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js特效代码，还有许多广告代码下载。 //--> </SCRIPT> <DIV id=www_zzjs_net style="Z-INDEX: 1"> <IMG onclick=zyva(0) src="/img/20110429wwwzzjsnet_1.jpg"> <IMG onclick=zyva(1) src="/img/20110429wwwzzjsnet_2.jpg"> <IMG onclick=zyva(2) src="/img/20110429wwwzzjsnet_3.jpg"> <IMG onclick=zyva(3) src="/img/20110429wwwzzjsnet_4.jpg"> <IMG onclick=zyva(4) src="/img/20110429wwwzzjsnet_5.jpg"> <IMG onclick=zyva(5) src="/img/20110429wwwzzjsnet_3.jpg"> <IMG onclick=zyva(6) src="/img/20110429wwwzzjsnet_4.jpg"> </DIV> <SPAN id=wwwzzjsnet style="LEFT: 50%; POSITION: absolute; TOP: 50%"> <SPAN style="FONT-SIZE: 10px; LEFT: -50px; COLOR: #ffffff; FONT-FAMILY: arial; POSITION: absolute; TOP: -18px">Loading...</SPAN> <SPAN style="FONT-SIZE: 1px; BACKGROUND: #333; LEFT: -50px; WIDTH: 100px; POSITION: absolute; TOP: -5px; HEIGHT: 10px"><SPAN id=LB1 style="FONT-SIZE: 1px; BACKGROUND: #ffffff; LEFT: 0px; WIDTH: 0px; POSITION: absolute; TOP: 0px; HEIGHT: 10px"></SPAN></SPAN> </SPAN> <SCRIPT>m00=document.getElementById("www_zzjs_net").getElementsByTagName("img");m01=m00.length;function loading_wwwzzjsnet(){m02=0;for(i=0;i<m01;i++)m02+=(m00[i].complete)?1:0;document.getElementById("LB1").style.width=Math.round(m02/m01*100);if(m02==m01)setTimeout("document.getElementById('wwwzzjsnet').style.display='none'",128); else setTimeout("loading_wwwzzjsnet()", 64);};loading_wwwzzjsnet();</SCRIPT> </BODY> </HTML>

提示：你可以先修改部分代码再运行。

顶一下

(2)

100%

踩一下

(0)

标签: