上篇文章给大家介绍了JS实现简单抖动效果,感兴趣的朋友点击查看。
今天给大家分享JS相册图片抖动放大展示效果,效果图如下所示:
var xm; var ym; /* ==== onmousemove event ==== */ document.Onmousemove= function(e){ if(window.event) e=window.event; xm = (e.x || e.clientX); ym = (e.y || e.clientY); } /* ==== window resize ==== */ function resize() { if(diapo)diapo.resize(); } Onresize= resize; /* ==== opacity ==== */ setOpacity = function(o, alpha){ if(o.filters)o.filters.alpha.opacity = alpha * 100; else o.style.opacity = alpha; } /* ===== encapsulate script ==== */ diapo = { O : [], DC : 0, img : 0, txt : 0, N : 0, xm : 0, ym : 0, nx : 0, ny : 0, nw : 0, nh : 0, rs : 0, rsB : 0, zo : 0, tx_pos : 0, tx_var : 0, tx_target : 0, /// script parameters attraction : 2, acceleration : .9, dampening : .1, zoomOver : 2, zoomClick : 6, transparency : .8, font_size: 18, // /* ==== diapo resize ==== */ resize : function(){ with(this){ nx = DC.offsetLeft; ny = DC.offsetTop; nw = DC.offsetWidth; nh = DC.offsetHeight; txt.style.fOntSize= Math.round(nh / font_size) + "px"; if(Math.abs(rs-rsB)<100) for(var i=0; i
到此这篇关于JS相册图片抖动放大展示效果的示例代码的文章就介绍到这了,更多相关js图片放大抖动内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!