0

我已经设法使用在悬停时进行图像预览,但是当我移动鼠标时,预览会随之移动并逃脱网页的边界“隐藏其中的一些”,有没有办法将其绑定为仅在网页就像 facebook 的照片缩放插件?

4

1 回答 1

0

我已经使用上面 Fiddle 中的代码创建了一个新的 Fiddle,其中包含一些工作代码,这些代码使用的逻辑与 Facebook Photo Zoom 插件似乎正在使用的逻辑相似。当光标移动到图像的顶部时,预览图像的顶部被设置为位于页面的顶部,一旦将光标移动到图像上的某个点下方,预览图像就会开始向下移动页面用它。

您还需要考虑其他因素,包括如果用户在显示预览图像时将鼠标光标快速移动到预览图像的顶部,则会导致预览被删除。我确信解决此问题的方法应该不会太难弄清楚,并且可能只需要在删除预览图像或在删除预览图像之前检查鼠标光标的当前位置时进行某种延迟。

在此处查看实际代码:http: //jsfiddle.net/f7rJB/2/

请注意,此代码只是为了显示预览图像被阻止离开页面边界并显示预览随着光标移动而向下移动,并不意味着是一个完整的解决方案。

jQuery 有一些关于在页面上查找鼠标位置的好文档:http://docs.jquery.com/Tutorials: Mouse_Position

于 2012-08-14T06:35:55.537 回答