jsonpeter / vue2.0-zoom

vue2.0图片放大镜插件
http://jsrun.net/nmiKp/show
65 stars 27 forks source link

页面出现滚动条后,显示异常 #2

Open xuzrrrrrrrrr opened 6 years ago

xuzrrrrrrrrr commented 6 years ago

在演示页面,将浏览器高度调整到出现滚动条 放大图片位置处于异常位置,mask也被锁定到最图片最下部

xuzrrrrrrrrr commented 6 years ago

getBoundingClientRect()获取的 left,top,是基于可视窗口的

参考:https://developer.mozilla.org/zh-CN/docs/Web/API/Element/getBoundingClientRect

imgLayer.style.left,imgLayer.style.top处加入window.scrollX和window.scrollY可解决该问题

xuzrrrrrrrrr commented 6 years ago

let objX = e.pageX - this.imgRect.x,let objY = e.pageY - this.imgRect.y处也要加上window.scrollX和window.scrollY

tanfangping commented 5 years ago

let objX = e.pageX - this.imgRect.x,let objY = e.pageY - this.imgRect.y处也要加上window.scrollX和window.scrollY 请问要怎么加??加在哪里

tanfangping commented 5 years ago

let objX = e.pageX - this.imgRect.x,let objY = e.pageY - this.imgRect.y处也要加上window.scrollX和window.scrollY

请问window.scrollY要怎么加

ggyy1945 commented 4 years ago

let objY=e.pageY - (this.imgRect.top +window.scrollY); imgLayer.style.top = this.imgRect.top+window.scrollY+ 'px';