js实现图片展示效果.docVIP

!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN /TR/html4/strict.dtd htmlheadtitle10款动感图片展示js代码-效果预览(10)/title meta http-equiv=imagetoolbar content=no style type=text/css body { background: #222; overflow: hidden; left: 0; top: 0; width: 100%; height: 100%; margin: 0; padding: 0; } #screen span { position:absolute; overflow:hidden; border:#FFF solid 1px; background:#FFF; } #screen img{ position:absolute; left:-32px; top:-32px; cursor: pointer; } #caption, #title{ color: #FFF; font-family: georgia, times new roman, times, veronica, serif; font-size: 1em; text-align: center; } #caption b { font-size: 2em; } /style script type=text/javascript!-- window.onerror = new Function(return true); var obj = []; var scr; var spa; var img; var W; var Wi; var Hi; var wi; var hi; var Sx; var Sy; var M; var xm; var ym; var xb = 0; var yb = 0; var ob = - 1; var cl = false; /* needed in standard mode */ px = function(x) { return Math.round(x) + px; } /* center image - do not resize for perf. reason */ img_center = function(o) { with(img[o]) { style.left = px( - (width - Wi) / 2); style.top = px( - (height - Hi) / 2); } } ////////////////////////////////////////////////////////// var Nx = 4; //size grid x var Ny = 4; //size grid y var Tx = 3; // image width var Ty = 3; // image height var Mg = 40; // margin var SP = 1; // speed ////////////////////////////////////////////////////////// function Cobj(o, x, y) { this.o = o; this.ix = Math.min(Nx - Tx, Math.max(0, Math.round(x - (Tx / 2)))); this.iy = Math.min(Ny - Ty, Math.max(0, Math.round(y - (Ty / 2)))); this.li = ((this.ix * M + this.ix * Sx) - (x * M + x * Sx)) / SP; this.ti = ((this.iy * M + this.iy * Sy) - (y * M + y * Sy)) / SP; this.l = 0; this.t = 0; this.w = 0; this.h = 0; this.s = 0; this.mv = false; this.spa = spa[o].style; this.img = img[o]; this.txt = img[o].alt; img[o].alt = ; /* zooming loop */ this.zoom = function() { with(this) { l += li * s; t += ti * s; w += wi * s; h += hi * s; if ((s 0 w Wi) || (s 0 w Sx