***图形特效***图片组和
把下列代码加到网页的<body></body>标签之间 从google下载我的照片管理软件要完成此效果需要两个步骤
第一步：把如下代码加入到<body>区域中
<style>
.spanstyle {
left: -5000px; position: absolute
}
</style>
<script>
<!--
var imgwidth=468
var imgheight=120
var imgurl=new array()
imgurl="../ts/pic/cgl/haire.gif"
imgurl="../ts/pic/cgl/haire.gif"
imgurl="../ts/pic/cgl/haire.gif"
var imgpreload=new array()
for (i=0;i<=imgurl.length-1;i++) {
imgpreload=new image()
imgpreload.src=imgurl
}
var x_finalpos=300
var y_finalpos=200
var x_slices=8
var y_slices=3
var pause=10
var screenwidth=800
var screenheight=500
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=20
var i_image=0
var width_slice=math.floor(imgwidth/x_slices)
var height_slice=math.floor(imgheight/y_slices)
var cliptop=0
var clipbottom=height_slice
var clipleft=0
var clipright=width_slice
var spancounter=0
function initiate() {
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 changeimage() {
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
thisspan.postop=-5000
spancounter++
}
}
spancounter=0
if (i_image>imgurl.length-1) {i_image=0}
for (i=0;i<=y_slices-1;i++) {
for (ii=0;ii<=x_slices-1;ii++) {
var thisinnerspan=eval("span"+spancounter)
thisinnerspan.innerhtml="<img src='"+imgurl+"'>"
spancounter++
}
}
i_image++
initiate()
}
function explode_ie() {
spancounter=0
if (i_loophttp://code.ik8.com/html/+imgurl+<=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=(x_finalpos-thisspan.posleft)/(max_loop-i_loop)
y_step=(y_finalpos-thisspan.postop)/(max_loop-i_loop)
thisspan.posleft+=x_step
thisspan.postop+=y_step
spancounter++
}
}
i_loop++
var timer=settimeout("explode_ie()",pause)
}
else {
spancounter=0
cleartimeout(timer)
var timer=settimeout("changeimage()",2000)
}
}
-->
</script>
<script>
<!--
if (document.all) {
for (i=0;i<=y_slices-1;i++) {
for (ii=0;ii<=x_slices-1;ii++) {
document.write("<span id='span"+spancounter+"' class='spanstyle'></span>")
spancounter++
}
}
spancounter=0
}
-->
</script>
第二步：把“onload=changeimage()”加在<body>标记里
例如：<body onload=changeimage()>
--------------------------------------
http://www.huoyue.com.cn 活跃网，活跃人群的论坛，访问活跃网，将给您带来意想不到的收获，还可以免费为您开论坛，让您免费拥有与朋友、网友交流的论坛。你是年轻人吗？你活跃你就上！
页:
[1]