基于 Vue 的商品主图放大镜方案

导读: 前言在做电商类应用时,难免会遇到商品主图实现放大镜效果的场景,现有的基于Vue的第三方包不多并且无法直接复用,今天,我来分享一种高稳定性的基于 Vue 的图片放大镜方法。实现

丝瓜网小编提示,记得把"基于 Vue 的商品主图放大镜方案"分享给大家!

前言

在做电商类应用时,难免会遇到商品主图实现放大镜效果的场景,现有的基于Vue的第三方包不多并且无法直接复用,今天,我来分享一种高稳定性的基于 Vue 的图片放大镜方法。

实现原理

放大镜的原理用一句话概括,就是根据小图上的鼠标位置去定位大图。图1 原理图(以2倍放大为例)

丝瓜网 crfgs.com