javascript - 悬停时放大图像的智能方法

标签 javascript html

有没有办法模仿this有图像事件吗? 悬停图像会放大,但它是以智能方式完成的 - 它知道浏览器窗口是否结束,并且它始终设法重新定位放大的图像,以便它始终显示完整图像。

我正在谈论的内容的照片示例: example1 example2

最佳答案

首先将 mouseover 和 mouseout 事件处理程序分配给图像类,将标志变量设置为 true 和 false。在鼠标悬停事件上,获取 img 源,然后在查看框中显示该图像。如果flag变量为true,则显示查看框并根据鼠标的位置调整其位置。至于决定在鼠标的哪一侧显示图像,我建议简单地检查鼠标是否超过 x 轴的一半。您可以通过检查 event.clientX > window.innerWidth/2

来完成此操作

关于javascript - 悬停时放大图像的智能方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21514818/

相关文章:

javascript - 告诉 jQuery 执行 value 属性中设置的 Action

html - 水平对齐的 fontawesome 图标

javascript - 电子邮件回复样式覆盖了我的样式

html - margin :0 auto; is not working to put one div center of another div

javascript - 转到随机帧,不包括当前帧

由 Javascript 加载的 XSL 中的 Javascript

javascript - 登录时渲染模板?

html - 我应该在 HTML5 中用/> 附上标签还是不附上标签?

javascript - 如何从javascript中的日期输入调用日期选择器?

javascript - 如何在 JavaScript 中用 “</p>” 替换字符串中所有出现的 “”?