<!-- website:http://www.webjx.com -->
<!-- bbs:http://bbs.webjx.com -->
<!-- 完整的HTML代码如下 -->
<HTML>
<HEAD>
<title>网页教学网一种特酷的图片展示特效</title>
<meta name="Author" content="from at http://www.webjx.com">
<meta http-equiv="imagetoolbar" content="no">
<STYLE>
BODY {
cursor:url("../CRCROSS.cur");
}
</STYLE>
</HEAD>
<BODY bgColor=#222222 onload=zyva() scroll=no>
<DIV id=images style="display:none">
<IMG src="http://www.webjx.com/upfiles/20050411/d1.jpg">
<IMG src="http://www.webjx.com/upfiles/20050411/d2.jpg">
<IMG src="http://www.webjx.com/upfiles/20050411/d3.jpg">
<IMG src="http://www.webjx.com/upfiles/20050411/d4.jpg">
<IMG src="http://www.webjx.com/upfiles/20050411/d70.jpg">
<IMG src="http://www.webjx.com/upfiles/20050411/d22.jpg">
<IMG src="http://www.webjx.com/upfiles/20050411/d8.jpg">
<IMG src="http://www.webjx.com/upfiles/20050411/d13.jpg">
<IMG src="http://www.webjx.com/upfiles/20050411/d40.jpg">
<IMG src="http://www.webjx.com/upfiles/20050411/d54.jpg">
</DIV>
<!-- crossbrowser images_loading_bar - Gerard Ferrandez - www.dhteumeuleu.com - Feb 2005 -->
<span id=LB0 style="position:absolute;left:50%;top:50%;"><span style="position:absolute;font-family:arial;font-size:10px;color:#FFFFFF;left:-50;top:-18">Loading...</span>
<span style="position:absolute;left:-50;top:-5;font-size:1px;width:100;height:10px;background:#333"><span id=LB1 style="position:absolute;left:0;top:0;font-size:1px;width:0;height:10px;background:#FFFFFF"></span></span></span>
<script>m00=document.getElementById("images").getElementsByTagName("img");m01=m00.length;function images_loading_bar(){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('LB0').style.display='none'",128); else setTimeout("images_loading_bar()", 64);};images_loading_bar();</script>
<!-- end of images_loading_bar code -->
<!-- DA Control layout -->
<OBJECT id=DAC
style="Z-INDEX: -1;BACKGROUND: #000000; LEFT: 0px; WIDTH: expression(document.body.clientWidth); POSITION: absolute; TOP: expression(document.body.clientHeight*.1); HEIGHT: expression(document.body.clientHeight-document.body.clientHeight*.2)" classid=CLSID:B6FFC24C-7E13-11D0-9B47-00C04FC2F51D>
<PARAM NAME="OpaqueForHitDetect" VALUE="0">
<PARAM NAME="UpdateInterval" VALUE="0.016">
</OBJECT>
<BGSOUND src="romance.mid" loop=infinite>
<SCRIPT>
// ======================================================
// http://www.webjx.com
// ======================================================
screen.bufferDepth = 16
document.onselectstart = function (){ return false }
xm = 0
ym = 0
cx = 0
cy = 10000
////////////
zOOm = .05
spAce = 5
r = 1.33
////////////
function programDA(){
m = DAC.MeterLibrary
NI = images.children.length
// square geometry (2 triangles)
square = m.TriMesh (2, [r,0,-1,-r,0,-1,-r,0,1,r,0,-1,-r,0,1,r,0,1], [0,1,0,0,1,0,0,1,0,0,1,0,0,1,0,0,1,0], [1,1,0,1,0,0,1,1,0,0,1,0], null)
square = square.Transform(m.Scale3Uniform(zOOm)).Transform(m.Rotate3(m.xVector3, Math.PI/2))
// light
geo = m.AmbientLight.LightColor(m.colorRgb255(255,255,255))
// --- add all DIV's
for(i=0;i<NI;i++){
// --- texture mapping
htmlTexture = m.ImportImage(images.children[i].src).MapToUnitSquare()
img = square.TextureImage(htmlTexture)
// --- passage
if(i<NI/2) geo = m.UnionGeometry(geo,img.Transform(m.Rotate3(m.yVector3,-Math.PI/2)).Transform(m.Translate3(.06,0,-i/spAce)))
else geo = m.UnionGeometry(geo,img.Transform(m.Rotate3(m.yVector3,Math.PI/2)).Transform(m.Translate3(-.06,0,-(i-(NI/2))/spAce)))
}
// --- perspective camera (modifiable behavior)
ROTCam = m.ModifiableBehavior(m.Rotate3(m.yVector3,0))
TRACam = m.ModifiableBehavior(m.Translate3(0,0,0))
// --- final rendering
DAC.Image = geo.render(m.PerspectiveCamera(0.1,0.09).Transform(ROTCam).Transform(TRACam))
}
function pilotDA(){
// --- mouse damping
cx+=Math.round((xm-cx)/10)
cy+=Math.round((ym-cy)/10)
// --- DA behaviors setting from JScript
ROTCam.SwitchTo(m.Rotate3(m.yVector3,cx / 100))
TRACam.SwitchTo(m.Translate3(0, 0, cy / 500))
}
function zyva(){
programDA()
DAC.Start()
document.onmousemove = function (){
xm = (-document.body.offsetWidth * .5) + window.event.clientX
ym = (document.body.offsetHeight * .1) - window.event.clientY * 500 / document.body.offsetHeight
}
setInterval("pilotDA()", 16)
}
</SCRIPT>
</BODY></HTML>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
所需要的图片：
http://www.webjx.com/upfiles/20050411/d1.jpg
http://www.webjx.com/upfiles/20050411/d2.jpg
http://www.webjx.com/upfiles/20050411/d3.jpg
http://www.webjx.com/upfiles/20050411/d4.jpg
http://www.webjx.com/upfiles/20050411/d70.jpg
http://www.webjx.com/upfiles/20050411/d22.jpg
http://www.webjx.com/upfiles/20050411/d8.jpg
http://www.webjx.com/upfiles/20050411/d13.jpg
