📄 图片的爆破效果.htm
字号:
<html>
<head>
<title>图片的爆破效果</title>
<script>
var imgwidth=172 //图片宽度
var imgheight=174 //图片高度
var imgurl="cat.gif" //图片文件
var redirurl="http://www.google.com" //链接地址
var x_finalpos=180 //图片横坐标
var y_finalpos=80 //图片纵坐标
var x_slices=8
var y_slices=4
var pause=10
var marginright
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
var x_random=new Array()
var y_random=new Array()
var max_explsteps=15
var i_explsteps=0
function initiate()
{
spancounter=0
for(i=0;i<=y_slices-1;i++)
{
for(ii=0;ii<=x_slices-1;ii++)
{
x_random[spancounter]=Math.ceil(240*Math.random())-120
y_random[spancounter]=Math.ceil(240*Math.random())-120
spancounter++
}
}
if(document.all)
{
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=x_finalpos
thisspan.posTop=y_finalpos
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
}
}
if (document.layers)
{
spancounter=0
for(i=0;i<=y_slices-1;i++)
{
for(ii=0;ii<=x_slices-1;ii++)
{
var thisspan=eval("document.span"+spancounter)
thisspan.left=x_finalpos
thisspan.top=y_finalpos
thisspan.clip.left=clipleft
thisspan.clip.right=clipright
thisspan.clip.top=cliptop
thisspan.clip.bottom=clipbottom
clipleft+=width_slice
clipright+=width_slice
spancounter++
}
clipleft=0
clipright=width_slice
cliptop+=height_slice
clipbottom+=height_slice
}
}
}
function checkbrowser()
{
spancounter=0
if(document.all)
{
explode_IE()
}
if(document.layers)
{
explode_NN()
}
}
function explode_IE()
{
spancounter=0
if (i_explsteps<=max_explsteps)
{
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+=x_random[spancounter]
thisspan.posTop+=y_random[spancounter]
spancounter++
}
}
i_explsteps++
var timer=setTimeout("explode_IE()",pause)
}
else
{
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++
}
}
clearTimeout(timer)
document.location.href=redirurl
}
}
function explode_NN()
{
spancounter=0
if (i_explsteps<=max_explsteps)
{
for (i=0;i<=y_slices-1;i++)
{
for (ii=0;ii<=x_slices-1;ii++)
{
var thisspan=eval("document.span"+spancounter)
thisspan.left+=x_random[spancounter]
thisspan.top+=y_random[spancounter]
spancounter++
}
}
i_explsteps++
var timer=setTimeout("explode_NN()",pause)
}
else
{
spancounter=0
for(i=0;i<=y_slices-1;i++)
{
for (ii=0;ii<=x_slices-1;ii++)
{
var thisspan=eval("document.span"+spancounter)
thisspan.visibility="hidden"
spancounter++
}
}
clearTimeout(timer)
document.location.href=redirurl
}
}
</script>
<style>
.spanstyle
{
position:absolute;
left:-5000px;
}
</style>
</head>
<body onload="initiate();">
<script>
for(i=0;i<=y_slices-1;i++)
{
for (ii=0;ii<=x_slices-1;ii++)
{
marginright=screen.width+50
document.write("<span id='span"+spancounter+"' class='spanstyle'>")
document.write("<a href='javascript:checkbrowser()'>")
document.write("<img src='"+imgurl+"' border='0'>")
document.write("</a>")
document.write("</span>")
spancounter++
}
}
</script>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -