js仿京东放大镜

本文实例为大家分享了js仿京东放大镜的具体代码，供大家参考，具体内容如下

1.实现效果：

移动遮挡框，右边的图片响应的放大并移动。

2.实现思路：

（1）鼠标移动到图片上，遮罩层和右边盒子显示。鼠标移出，遮罩层和右边盒子消失。

（2）黄色遮罩层跟随鼠标移动

（3）右边图片跟随左边图片移动

注意：右边图片的移动方向与左边遮罩层的移动方向相反，因此，右边图片移动距离是负的。

右边大盒子：多余的图片不显示，用overflow:hidden.来隐藏

3.代码展示

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。