以鼠標位置為中心的圖片滾動放大縮小


 1  //以鼠標位置為中心的圖片滾動放大縮小
 2 $(document).on("mousewheel","#mask img",function(ev){
 3     var oImg = this;
 4     var ev = event || window.event;//返回WheelEvent
 5     ev.preventDefault();
 6     var delta = ev.detail ? ev.detail > 0 : ev.wheelDelta < 0;
 7     var ratioL = (ev.clientX - oImg.offsetLeft) / oImg.offsetWidth,
 8         ratioT = (ev.clientY - oImg.offsetTop) / oImg.offsetHeight,
 9         ratioDelta = !delta ? 1 + 0.1 : 1 - 0.1,
10         w = parseInt(oImg.offsetWidth * ratioDelta),
11         h = parseInt(oImg.offsetHeight * ratioDelta),
12         l = Math.round(ev.clientX - (w * ratioL)),
13         t = Math.round(ev.clientY - (h * ratioT));
14         with(oImg.style) {
15             width = w +'px';
16             height = h +'px';
17             left = l +'px';
18             top = t +'px';
19         }
20 });

廢話不多說,相信程序員看了都知道怎么用。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM